ekreten reborn

2025-04-22 23:24:53 +02:00 · 2025-04-22 23:24:53 +02:00 · 9e95427903
commit 9e95427903
60 changed files with 4379 additions and 0 deletions
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1,50 @@
+node_modules
+
+# SvelteKit build output
+/build
+/.svelte-kit
+/package
+
+# Environment files
+.env
+.env.*
+!.env.example
+
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+# Testing
+/coverage
+/playwright-report
+/test-results
+
+# Production
+/dist
+/static/protected
+
+# Debug
+.pnpm-debug.log*
+.npm
+.eslintcache
+
+# Misc
+*.pem
+.vercel
+.netlify
+.turbo
--- a/.npmrc
+++ b/.npmrc
@ -0,0 +1 @@
+engine-strict=true
--- a/README.md
+++ b/README.md
@ -0,0 +1,12 @@
+# ekreten
+
+just a weird thing
+
+## setup
+
+need node.js / npm (or anything else if that pleases u).
+
+```bash
+npm install
+npm run dev
+```
--- a/jsconfig.json
+++ b/jsconfig.json
@ -0,0 +1,13 @@
+{
+	"extends": "./.svelte-kit/tsconfig.json",
+	"compilerOptions": {
+		"allowJs": true,
+		"checkJs": false,
+		"moduleResolution": "bundler"
+	}
+	// Path aliases are handled by https://svelte.dev/docs/kit/configuration#alias
+	// except $lib which is handled by https://svelte.dev/docs/kit/configuration#files
+	//
+	// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
+	// from the referenced tsconfig.json - TypeScript does not merge them in
+}
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -0,0 +1,22 @@
+{
+	"name": "ekretenhu",
+	"private": true,
+	"version": "0.0.1",
+	"type": "module",
+	"scripts": {
+		"dev": "vite dev",
+		"build": "vite build",
+		"preview": "vite preview",
+		"prepare": "svelte-kit sync || echo ''"
+	},
+	"devDependencies": {
+		"@sveltejs/adapter-auto": "^4.0.0",
+		"@sveltejs/kit": "^2.16.0",
+		"@sveltejs/vite-plugin-svelte": "^5.0.0",
+		"@types/crypto-js": "^4.2.2",
+		"crypto-js": "^4.2.0",
+		"mkdirp": "^3.0.1",
+		"svelte": "^5.0.0",
+		"vite": "^6.0.0"
+	}
+}
--- a/src/app.html
+++ b/src/app.html
@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8" />
+		<link rel="icon" href="%sveltekit.assets%/favicon.png" />
+		<meta name="viewport" content="width=device-width, initial-scale=1" />
+		%sveltekit.head%
+	</head>
+	<body data-sveltekit-preload-data="hover">
+		<div style="display: contents">%sveltekit.body%</div>
+	</body>
+</html>
--- a/src/lib/components/footer.svelte
+++ b/src/lib/components/footer.svelte
@ -0,0 +1,41 @@
+<footer>
+    <div class="footer-links">
+        <a href="https://git.spitkov.hu/spitkov/ekreten">Az oldal forráskódja</a>
+        <span class="footer-separator">•</span>
+        <p>Készült 🍊 megbízásából, 12 Mrd ft közpénzből</p>
+    </div>
+</footer>
+
+<style>
+    footer {
+        text-align: center;
+        padding: clamp(0.8rem, 3vw, 1rem);
+        color: white;
+        font-size: clamp(0.75rem, 3vw, 0.8rem);
+        width: 100%;
+        display: flex;
+        flex-direction: column;
+        gap: 0.5rem;
+        align-items: center;
+    }
+
+    .footer-links {
+        display: flex;
+        align-items: center;
+        gap: 1rem;
+    }
+
+    .footer-separator {
+        color: rgba(255, 255, 255, 0.5);
+    }
+
+    footer a {
+        color: white;
+        text-decoration: none;
+        padding: 0.5rem;
+        min-height: 44px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
+</style>
--- a/src/lib/index.js
+++ b/src/lib/index.js
@ -0,0 +1 @@
+// place files you want to import through the `$lib` alias in this folder.
--- a/src/routes/+error.svelte
+++ b/src/routes/+error.svelte
@ -0,0 +1,250 @@
+<script>
+  import { page } from '$app/stores';
+  import Footer from '$lib/components/footer.svelte';
+</script>
+
+<svelte:head>
+  <title>404 - KRETÉN - Valaki már letörölte</title>
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
+</svelte:head>
+
+<div class="app-container">
+  <main>
+    <div class="logo-container">
+      <img src="/logo.png" class="logo" alt="KRETÉN logo">
+    </div>
+
+    <div class="error-container">
+      <div class="error-header">
+        <h2>néccánégy nem található</h2>
+      </div>
+
+      <div class="error-content">
+        <p class="error-message">
+          A keresett oldal ({$page.url.pathname}) már nem található meg a rendszerben.
+        </p>
+        <p class="error-note">
+          Lehetséges okok:
+        </p>
+        <ul class="error-reasons">
+          <li>Az admin már letörölte az egész adatbázist (legvalószínűbb)</li>
+          <li>Róbert'); DROP TABLE Pages;-- megint SQL injectiont használt</li>
+          <li>Az api-t megint megváltozatták és ez az oldal még nem használja az új api-t</li>
+          <li>Az oldal sosem létezett, csak képzelted</li>
+          <li>Ha nem megy hát nem megy</li>
+          <li>:3</li>
+        </ul>
+        <div class="error-actions">
+          <a href="/" class="back-button">Vissza a bejelentkezéshez</a>
+        </div>
+      </div>
+    </div>
+  </main>
+
+  <Footer />
+</div>
+
+<style>
+  :global(html), :global(body) {
+    margin: 0;
+    padding: 0;
+    width: 100%;
+    height: 100%;
+    overflow-x: hidden;
+    -webkit-text-size-adjust: 100%;
+    touch-action: manipulation;
+  }
+  
+  * {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+    font-family: Arial, sans-serif;
+    -webkit-tap-highlight-color: transparent;
+  }
+
+  .app-container {
+    display: flex;
+    flex-direction: column;
+    min-height: 100vh;
+    width: 100vw;
+    background-color: #385764;
+    color: #333;
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    overflow-x: hidden;
+    padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
+  }
+
+  main {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: flex-start;
+    padding: clamp(1rem, 5vw, 2rem);
+    width: 100%;
+    margin-top: clamp(1rem, 5vh, 3rem);
+  }
+
+  .logo-container {
+    margin-bottom: clamp(1.5rem, 5vh, 2rem);
+    text-align: center;
+    padding: 0 1rem;
+  }
+
+  .logo {
+    max-width: 100%;
+    height: auto;
+    width: auto;
+    max-height: 120px;
+  }
+
+  .error-container {
+    background-color: white;
+    border-radius: 4px;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+    width: 100%;
+    max-width: 600px;
+    overflow: hidden;
+    margin: 0 1rem;
+  }
+
+  .error-header {
+    background-color: #e74c3c;
+    color: white;
+    padding: 1rem;
+    text-align: center;
+  }
+
+  .error-header h2 {
+    font-size: clamp(1rem, 4vw, 1.2rem);
+    font-weight: normal;
+    margin: 0;
+    line-height: 1.3;
+  }
+
+  .error-content {
+    padding: clamp(1rem, 4vw, 1.5rem);
+  }
+
+  .error-message {
+    margin-bottom: 1rem;
+    font-size: clamp(0.85rem, 3.5vw, 0.9rem);
+    color: #e74c3c;
+    font-weight: bold;
+  }
+
+  .error-note {
+    margin-bottom: 0.5rem;
+    font-size: clamp(0.85rem, 3.5vw, 0.9rem);
+    font-weight: bold;
+  }
+
+  .error-reasons {
+    list-style-type: none;
+    margin-bottom: 1.5rem;
+    padding: 0;
+  }
+
+  .error-reasons li {
+    margin-bottom: 0.5rem;
+    font-size: clamp(0.85rem, 3.5vw, 0.9rem);
+    padding-left: 1.5rem;
+    position: relative;
+  }
+
+  .error-reasons li::before {
+    content: "•";
+    position: absolute;
+    left: 0.5rem;
+    color: #e74c3c;
+  }
+
+  .error-actions {
+    display: flex;
+    justify-content: center;
+    margin-top: 1.5rem;
+  }
+
+  .back-button {
+    background-color: #30b0d5;
+    color: white;
+    border: none;
+    border-radius: 4px;
+    padding: clamp(0.6rem, 3vw, 0.8rem) clamp(1rem, 4vw, 1.2rem);
+    font-size: clamp(0.85rem, 3.5vw, 0.9rem);
+    cursor: pointer;
+    transition: background-color 0.2s;
+    text-decoration: none;
+    min-width: 200px;
+    text-align: center;
+  }
+
+  .back-button:hover {
+    background-color: #2698bb;
+  }
+
+  footer {
+    text-align: center;
+    padding: clamp(0.8rem, 3vw, 1rem);
+    color: white;
+    font-size: clamp(0.75rem, 3vw, 0.8rem);
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+    align-items: center;
+  }
+
+  .footer-links {
+    display: flex;
+    align-items: center;
+    gap: 1rem;
+  }
+
+  .footer-separator {
+    color: rgba(255, 255, 255, 0.5);
+  }
+
+  footer a {
+    color: white;
+    text-decoration: none;
+    padding: 0.5rem;
+    min-height: 44px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  @media (max-width: 640px) {
+    .logo {
+      max-height: 100px;
+    }
+
+    .error-container {
+      margin: 0 0.5rem;
+    }
+
+    .error-content {
+      padding: 1rem;
+    }
+  }
+
+  @media (orientation: landscape) and (max-height: 600px) {
+    main {
+      margin-top: 0.5rem;
+    }
+
+    .logo {
+      max-height: 80px;
+    }
+
+    .logo-container {
+      margin-bottom: 1rem;
+    }
+  }
+</style> 
--- a/src/routes/+layout.js
+++ b/src/routes/+layout.js
@ -0,0 +1,2 @@
+export const ssr = true;
+export const trailingSlash = 'never'; 
--- a/src/routes/+page.server.js
+++ b/src/routes/+page.server.js
@ -0,0 +1,25 @@
+import fs from 'fs';
+import path from 'path';
+
+export async function load() {
+  let dirtyWords = [];
+  try {
+    const filePath = path.resolve('static', 'dirtyWords.xml');
+    const xmlData = fs.readFileSync(filePath, 'utf8');
+    const wordRegex = /<Word[^>]*>(.*?)<\/Word>/g;
+    let match;
+
+    while ((match = wordRegex.exec(xmlData)) !== null) {
+      dirtyWords.push(match[1]);
+    }
+    
+    return {
+      dirtyWords
+    };
+  } catch (error) {
+    console.error('Failed to load dirty words:', error);
+    return {
+      dirtyWords: []
+    };
+  }
+} 
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@ -0,0 +1,777 @@
+<script>
+  import { onMount } from 'svelte';
+  import Footer from '$lib/components/footer.svelte';
+  export let data; 
+
+  let username = '';
+  let password = '';
+  let selectedWords = '';
+  let isLoggingIn = false;
+  let loginMessage = '';
+  let schools = [];
+  let selectedSchool = '';
+  let schoolSearchText = '';
+  let showSchoolDropdown = false;
+  let showForgotPasswordModal = false;
+  let isTemplateActive = false;
+
+  const credentialsMap = {
+    'admin': 'admin',
+    'skelly': 'skelly',
+    'klima': 'klima',
+    'spitkov': 'spitkov',
+    'firka': 'firka',
+    'taxfraud': 'taxfraud',
+    'wide_gold_storage_silo': 'wide_gold_storage_silo',
+    'pearoo': 'pearoo',
+    '9suw9suw9': '9suw9suw9',
+    'menczer': 'tamas',
+    'tomcat': 'tomcat',
+    'arad': 'atisza',
+    'sodika': 'kissendrefarkas'
+  };
+
+  const redirectsMap = {
+    'spitkov': 'https://spitkov.wtf',
+    'firka': 'https://firka.app',
+    'taxfraud': 'https://marcellh.me'
+  };
+
+  async function loadSchools() {
+    try {
+      const response = await fetch('/sulik.json');
+      const data = await response.json();
+      schools = data;
+    } catch (error) {
+      console.error('Error loading schools:', error);
+    }
+  }
+
+  function shuffleWords() {
+    if (!data || !data.dirtyWords || data.dirtyWords.length === 0) {
+      return;
+    }
+    
+    const shuffled = [...data.dirtyWords].sort(() => 0.5 - Math.random());
+    const selected = shuffled.slice(0, 3);
+    selectedWords = selected.map(word => word.toLowerCase()).join(' ');
+  }
+
+  async function fetchTemplate(templateName) {
+    const basePath = `/templates/${templateName}`;
+    try {
+      const [htmlRes, cssRes, jsRes] = await Promise.all([
+        fetch(`${basePath}/template.html`),
+        fetch(`${basePath}/template.css`),
+        fetch(`${basePath}/template.js`)
+      ]);
+
+      if (!htmlRes.ok || !cssRes.ok || !jsRes.ok) {
+        console.error(`Error fetching template ${templateName}: One or more files not found or failed to load.`);
+        return { html: '<p>Error loading template content.</p>', css: '', js: '' };
+      }
+
+      const html = await htmlRes.text();
+      const css = await cssRes.text();
+      const js = await jsRes.text();
+      return { html, css, js };
+    } catch (error) {
+      console.error(`Error fetching template ${templateName}:`, error);
+      return { html: '<p>Error loading template.</p>', css: '', js: '' };
+    }
+  }
+
+  async function handleLogin() {
+    isLoggingIn = true;
+    loginMessage = `SELECT * FROM users WHERE username = "${username}" AND password = "${password}"`;
+
+    await new Promise(resolve => setTimeout(resolve, 1000)); 
+
+    try {
+      const isSqlInjection = /.*DROP\\s+TABLE\\s+tanulo.*/i.test(username);
+
+      if (isSqlInjection) {
+        isTemplateActive = true;
+        document.querySelector('main').innerHTML = `
+          <div class="logo-container">
+              <img src="/logo.png" class="logo" alt="KRETÉN logo">
+          </div>
+          <code style="color: white;">Query OK, 3742 rows affected</code>
+          <style>
+              .logo-container {
+                  margin-bottom: 2rem;
+                  text-align: center;
+              }
+              .logo { max-width: 100%; height: auto; width: auto; max-height: 120px; }
+          </style>
+        `;
+        isLoggingIn = false;
+        loginMessage = '';
+        return;
+      }
+
+      if (credentialsMap[username] && password === credentialsMap[username]) {
+        if (redirectsMap[username]) {
+          window.location.href = redirectsMap[username];
+          return; 
+        }
+
+        // --- Template Loading Logic for All Users (except redirects) ---
+        
+        const template = await fetchTemplate(username);
+        let finalJs = template.js;
+
+        if (template.css) {
+            const styleElement = document.createElement('style');
+            styleElement.textContent = template.css;
+            document.head.appendChild(styleElement);
+        }
+
+        // Replace main content with the fetched template HTML for all users
+        isTemplateActive = true;
+        document.querySelector('main').innerHTML = template.html;
+
+        // --- User-Specific JS Handling (Removed Admin Specifics) ---
+        /*
+        if (username === 'admin') {
+          finalJs = template.js.replace('{{PASSWORD_PLACEHOLDER}}', password); 
+        }
+        */
+        // Add other user-specific JS modifications here if needed in the future
+
+        // Add event listeners common to all templates (like Back button)
+        setTimeout(() => {
+            const backButton = document.getElementById('backToLogin');
+            if (backButton) {
+              backButton.addEventListener('click', () => {
+                isTemplateActive = false;
+                isLoggingIn = false;
+                loginMessage = '';
+                username = '';
+                password = '';
+                window.location.reload();
+              });
+            }
+        }, 0);
+
+        // Inject the final JavaScript
+        if (finalJs) {
+            const scriptElement = document.createElement('script');
+            scriptElement.textContent = finalJs;
+            document.body.appendChild(scriptElement);
+        }
+        
+        isLoggingIn = false;
+        loginMessage = '';
+        username = '';
+        password = '';
+
+      } else {
+        loginMessage = "<p style='margin: 0;'>0 rows returned from database query.</p>";
+        isLoggingIn = false;
+      }
+    } catch (error) {
+      console.error('Login error:', error);
+      loginMessage = "Hiba történt a bejelentkezés során. Próbáld újra később.";
+      isLoggingIn = false;
+    }
+  }
+
+  function handleForgotPassword() {
+    showForgotPasswordModal = true;
+  }
+
+  function closeModal() {
+    showForgotPasswordModal = false;
+  }
+
+  function handleSchoolSearch(event) {
+    schoolSearchText = event.target.value;
+    showSchoolDropdown = true;
+  }
+
+  function selectSchool(school) {
+    selectedSchool = school.nev;
+    schoolSearchText = school.nev;
+    showSchoolDropdown = false;
+  }
+
+  $: filteredSchools = schoolSearchText.length > 0
+    ? schools.filter(school => school.nev.toLowerCase().includes(schoolSearchText.toLowerCase())).slice(0, 5)
+    : schools.slice(0, 5);
+
+  onMount(() => {
+    loadSchools();
+    shuffleWords();
+  });
+</script>
+
+<svelte:head>
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
+  <meta property="og:type" content="website">
+  <meta property="og:url" content="https://ekreten.hu/">
+  <meta property="og:title" content="KRETÉN">
+  <meta property="og:description" content="orbán 🍊">
+  <meta property="og:image" content="https://ekreten.hu/favicon.png">
+
+  <meta property="twitter:card" content="summary">
+  <meta property="twitter:url" content="https://ekreten.hu/">
+  <meta property="twitter:title" content="KRETÉN">
+  <meta property="twitter:description" content="orbán 🍊">
+  <meta property="twitter:image" content="https://ekreten.hu/favicon.png">
+</svelte:head>
+
+<div class="app-container">
+  <main>
+    <div class="logo-container">
+      <img src="/logo.png" class="logo" alt="KRETÉN logo">
+    </div>
+
+    {#if !isTemplateActive}
+      <div class="login-container">
+        <div class="login-header">
+          <h2>Mi van, te kis {selectedWords || 'toszatlan'}?</h2>
+          <button class="refresh-button" on:click={shuffleWords}>⟳</button>
+        </div>
+
+        <div class="login-form">
+          <p class="login-instructions">
+            Kérjük, adja meg az intézményi KRETÉN felhasználónevét és jelszavát.
+            Amennyiben elfelejtette, keresse meg valamelyik publikus adatbázisban
+          </p>
+
+          <p class="login-note">
+            Tisztelt <span class="highlight">Róbert');-- DROP TABLE Tanulo;</span>, technikai okok miatt lehetséges, hogy a rendszer néha (<i>azaz soha</i>) nem működik.
+          </p>
+          <form 
+            on:submit|preventDefault={handleLogin}
+            class="login-form-content"
+          >
+           
+
+            <div class="form-group">
+              <input 
+                type="text" 
+                placeholder="Felhasználónév" 
+                bind:value={username}
+                class="form-input"
+                disabled={isLoggingIn}
+              />
+            </div>
+
+            <div class="form-group">
+              <input 
+                type="password" 
+                placeholder="Jelszó" 
+                bind:value={password}
+                class="form-input"
+                disabled={isLoggingIn}
+              />
+            </div>
+            <!--
+             <div class="form-group school-selector">
+              <div class="select-wrapper">
+                <input 
+                  type="text" 
+                  id="school-search" 
+                  placeholder="Kezdje el begépelni az intézmény nevének valamely részletét..." 
+                  class="form-input school-search"
+                  bind:value={schoolSearchText}
+                  on:input={handleSchoolSearch}
+                  on:focus={() => showSchoolDropdown = true}
+                  on:blur={() => setTimeout(() => showSchoolDropdown = false, 200)}
+                />
+                {#if showSchoolDropdown && filteredSchools.length > 0}
+                  <div class="school-dropdown">
+                    {#each filteredSchools as school}
+                      <div 
+                        class="school-option" 
+                        on:mousedown={() => selectSchool(school)}
+                      >
+                        {school.nev}
+                      </div>
+                    {/each}
+                  </div>
+                {/if}
+              </div>
+            </div>
+            -->
+
+            {#if loginMessage}
+              <div class={isLoggingIn ? "login-message" : "login-error"}>
+                <div>{@html loginMessage}</div>
+                {#if isLoggingIn}
+                  <div class="spinner"></div>
+                {/if}
+              </div>
+            {/if}
+
+            <div class="form-actions">
+              <a href="#" on:click|preventDefault={handleForgotPassword} class="forgot-password">
+                Elfelejtettem a jelszavam
+              </a>
+              <button type="submit" class="login-button" disabled={isLoggingIn}>
+                Bejelentkezés
+              </button>
+            </div>
+          </form>
+        </div>
+      </div>
+
+      <div class="disclaimer-alert">
+        Ez az oldal kizárólag szatirikus céllal készült, semmilyen kapcsolatban nincs ez az eredeti e-kretaval.<br>
+        A bejelentkezési adatok nem az igazi KRÉTA-hoz tartoznak, hanem az oldal easter egg-jei.<br>
+        Ne add meg a valódi KRÉTA bejelentkezési adataidat!
+      </div>
+    {/if}
+  </main>
+
+  <Footer />
+</div>
+
+{#if showForgotPasswordModal}
+  <div class="modal-backdrop" on:click={closeModal}>
+    <div class="modal-content" on:click|stopPropagation>
+      <div class="modal-header">
+        <h3>Jelszó visszaállítás</h3>
+        <button class="modal-close" on:click={closeModal}>×</button>
+      </div>
+      <div class="modal-body">
+        <div class="spinner modal-spinner"></div>
+        <p class="modal-text">A jelszó helyreállítási kérelmét feldolgoztuk, és a következő eredményre jutottunk:</p>
+        <p class="modal-error">A KRETÉN nem találta önt <span class="highlight">(Róbert');-- DROP TABLE Tanulo;)</span>-t elég fontosnak ahhoz, hogy foglalkozzon a problémájával.</p>
+        <p class="modal-tip">Javasolt megoldások:</p>
+        <ul class="modal-solutions">
+          <li>Próbáld meg kitalálni a jelszavad. 
+            Tippek: <strong>123456</strong>, <strong>password</strong>, <strong>admin</strong>, <strong>qwerty</strong>.</li>
+          <li>Kérdezd meg az informatika tanárodat, ő biztosan jobban emlékszik a jelszavadra, mint te.</li>
+          <li>Kapcsold ki és be a gépedet.</li>
+          <li>Használj firkát. (legjobb opció)</li>
+          <li>Az is lehet, hogy a reFilc leakelt adatbázisában lett elmentve a jelszavad, kérdezd meg Kimát is.</li>
+        </ul>
+        <p class="modal-footer-text">Az új jelszót elküldtük egy véletlenszerű e-mail címre, amit hasonlónak véltünk a tiedhez.</p>
+      </div>
+    </div>
+  </div>
+{/if}
+
+<style>
+  :global(html), :global(body) {
+    margin: 0;
+    padding: 0;
+    width: 100%;
+    height: 100%;
+    overflow-x: hidden;
+    -webkit-text-size-adjust: 100%;
+    touch-action: manipulation;
+  }
+  
+  * {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+    font-family: Arial, sans-serif;
+    -webkit-tap-highlight-color: transparent;
+  }
+
+  .app-container {
+    display: flex;
+    flex-direction: column;
+    min-height: 100vh;
+    width: 100vw;
+    background-color: #385764;
+    color: #333;
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    overflow-x: hidden;
+    padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
+  }
+
+  main {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: flex-start;
+    padding: clamp(1rem, 5vw, 2rem);
+    width: 100%;
+    margin-top: clamp(1rem, 5vh, 3rem);
+  }
+
+  .logo-container {
+    margin-bottom: clamp(1.5rem, 5vh, 2rem);
+    text-align: center;
+    padding: 0 1rem;
+  }
+
+  .logo {
+    max-width: 100%;
+    height: auto;
+    width: auto;
+    max-height: 120px;
+  }
+
+  .login-container {
+    background-color: white;
+    border-radius: 4px;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+    width: 100%;
+    max-width: 600px;
+    overflow: hidden;
+    margin: 0 1rem;
+  }
+
+  .login-header {
+    background-color: #30b0d5;
+    color: white;
+    padding: 1rem;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+
+  .login-header h2 {
+    font-size: clamp(1rem, 4vw, 1.2rem);
+    font-weight: normal;
+    margin: 0;
+    line-height: 1.3;
+  }
+
+  .refresh-button {
+    background: none;
+    border: none;
+    color: white;
+    font-size: clamp(1.2rem, 5vw, 1.5rem);
+    cursor: pointer;
+    padding: 0.5rem;
+    width: 44px;
+    height: 44px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    touch-action: manipulation;
+  }
+
+  .login-form {
+    padding: clamp(1rem, 4vw, 1.5rem);
+  }
+
+  .login-instructions {
+    margin-bottom: 1rem;
+    font-size: clamp(0.85rem, 3.5vw, 0.9rem);
+  }
+
+  .login-note {
+    margin-bottom: 1.5rem;
+    font-size: clamp(0.85rem, 3.5vw, 0.9rem);
+  }
+
+  .highlight {
+    color: #30b0d5;
+    text-decoration: underline;
+    cursor: pointer;
+  }
+
+  .form-group {
+    margin-bottom: clamp(0.8rem, 3vw, 1rem);
+  }
+
+  .form-input {
+    width: 100%;
+    padding: 0.4rem 0.6rem;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+    background-color: #f5f5f5;
+    font-size: 16px;
+  }
+
+  .select-wrapper {
+    position: relative;
+  }
+
+  .school-dropdown {
+    position: absolute;
+    top: 100%;
+    left: 0;
+    right: 0;
+    max-height: clamp(180px, 40vh, 300px);
+    overflow-y: auto;
+    background-color: white;
+    border: 1px solid #ddd;
+    border-top: none;
+    border-radius: 0 0 4px 4px;
+    z-index: 10;
+    display: block;
+  }
+
+  .school-option {
+    padding: clamp(0.7rem, 3vw, 0.8rem);
+    cursor: pointer;
+    border-bottom: 1px solid #eee;
+    font-size: clamp(0.85rem, 3.5vw, 0.9rem);
+  }
+
+  .school-option:hover {
+    background-color: #f5f5f5;
+  }
+
+  .login-message {
+    background-color: #f8f9fa;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+    padding: clamp(0.8rem, 3vw, 1rem);
+    margin-bottom: 1.5rem;
+    text-align: center;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 1rem;
+    font-size: clamp(0.85rem, 3.5vw, 0.9rem);
+  }
+
+  .login-error {
+    background-color: #f8d7da;
+    border: 1px solid #f5c6cb;
+    border-radius: 4px;
+    padding: clamp(0.8rem, 3vw, 1rem);
+    margin-bottom: 1.5rem;
+    text-align: center;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 1rem;
+    font-size: clamp(0.85rem, 3.5vw, 0.9rem);
+    color: #e74c3c;
+  }
+
+  .spinner {
+    width: clamp(30px, 8vw, 40px);
+    height: clamp(30px, 8vw, 40px);
+    border: 4px solid rgba(0, 0, 0, 0.1);
+    border-radius: 50%;
+    border-top-color: #30b0d5;
+    animation: spin 1s ease-in-out infinite;
+  }
+
+  .form-actions {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-top: 1.5rem;
+    gap: 1rem;
+  }
+
+  .forgot-password {
+    color: #30b0d5;
+    text-decoration: none;
+    font-size: clamp(0.85rem, 3.5vw, 0.9rem);
+  }
+
+  .login-button {
+    background-color: #30b0d5;
+    color: white;
+    border: none;
+    border-radius: 4px;
+    padding: clamp(0.4rem, 2vw, 0.5rem) clamp(0.8rem, 3vw, 1rem);
+    font-size: clamp(0.85rem, 3.5vw, 0.9rem);
+    cursor: pointer;
+    transition: background-color 0.2s;
+    min-width: 120px;
+  }
+
+  .login-button:hover {
+    background-color: #2698bb;
+  }
+
+  .login-button:disabled {
+    background-color: #88cce2;
+    cursor: not-allowed;
+  }
+
+  .disclaimer-alert {
+    background-color: #cce5ff;
+    border: 1px solid #b8daff;
+    color: #004085;
+    padding: 12px 20px;
+    border-radius: 4px;
+    margin-top: 20px;
+    text-align: center;
+    font-size: 0.95rem;
+    max-width: 600px;
+    margin-left: auto;
+    margin-right: auto;
+    margin-bottom: 0;
+  }
+
+  .modal-backdrop {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-color: rgba(0, 0, 0, 0.8);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    z-index: 1000;
+    padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
+  }
+
+  .modal-content {
+    background-color: white;
+    border-radius: 4px;
+    width: 95%;
+    max-width: 500px;
+    max-height: 90vh;
+    overflow-y: auto;
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
+    display: flex;
+    flex-direction: column;
+  }
+
+  .modal-header {
+    background-color: #30b0d5;
+    color: white;
+    padding: clamp(0.8rem, 3vw, 1rem);
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    min-height: 60px;
+  }
+
+  .modal-header h3 {
+    font-size: clamp(1rem, 4vw, 1.2rem);
+    font-weight: normal;
+    margin: 0;
+  }
+
+  .modal-close {
+    background: none;
+    border: none;
+    color: white;
+    font-size: clamp(1.5rem, 5vw, 1.8rem);
+    cursor: pointer;
+    padding: 0.3rem;
+    width: 36px;
+    height: 36px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    touch-action: manipulation;
+  }
+
+  .modal-body {
+    padding: clamp(1rem, 4vw, 1.5rem);
+    text-align: center;
+  }
+
+  .modal-spinner {
+    margin: 0 auto 1.5rem;
+  }
+
+  .modal-text {
+    margin-bottom: 1rem;
+    font-size: clamp(0.85rem, 3.5vw, 0.9rem);
+  }
+
+  .modal-error {
+    margin-bottom: 1.5rem;
+    color: #e74c3c;
+    font-weight: bold;
+    font-size: clamp(0.9rem, 3.5vw, 1rem);
+  }
+
+  .modal-tip {
+    margin-bottom: 0.5rem;
+    font-weight: bold;
+    font-size: clamp(0.85rem, 3.5vw, 0.9rem);
+  }
+
+  .modal-solutions {
+    text-align: left;
+    margin-bottom: 1.5rem;
+    padding-left: 1.5rem;
+  }
+
+  .modal-solutions li {
+    margin-bottom: 0.5rem;
+    font-size: clamp(0.85rem, 3.5vw, 0.9rem);
+  }
+
+  .modal-footer-text {
+    font-size: clamp(0.8rem, 3vw, 0.85rem);
+    font-style: italic;
+    color: #777;
+  }
+
+ 
+  @keyframes spin {
+    to { transform: rotate(360deg); }
+  }
+
+  @media (max-width: 640px) {
+    .form-actions {
+      flex-direction: column;
+      align-items: stretch;
+    }
+
+    .login-button {
+      width: 100%;
+      order: -1;
+    }
+
+    .forgot-password {
+      text-align: center;
+    }
+
+    .modal-content {
+      width: 100%;
+      height: 100%;
+      max-height: none;
+      border-radius: 0;
+    }
+  }
+
+  @media (orientation: landscape) and (max-height: 600px) {
+    main {
+      margin-top: 0.5rem;
+    }
+
+    .logo {
+      max-height: 80px;
+    }
+
+    .logo-container {
+      margin-bottom: 1rem;
+    }
+
+    .login-form {
+      padding: 1rem;
+    }
+
+    .form-group {
+      margin-bottom: 0.5rem;
+    }
+
+    .form-actions {
+      margin-top: 1rem;
+    }
+  }
+
+  .admin-button {
+    background-color: #30b0d5;
+    color: white;
+    border: none;
+    border-radius: 4px;
+    padding: clamp(0.4rem, 2vw, 0.5rem) clamp(0.8rem, 3vw, 1rem);
+    font-size: clamp(0.85rem, 3.5vw, 0.9rem);
+    cursor: pointer;
+    transition: background-color 0.2s;
+    text-align: center;
+    text-decoration: none;
+    display: block;
+  }
+</style>
--- a/static/dirtyWords.xml
+++ b/static/dirtyWords.xml
@ -0,0 +1,367 @@
+<?xml version="1.0" encoding="utf-8"?>
+<DirtyWords>
+  <Word type="m">Aberált</Word>
+  <Word type="m">Aberrált</Word>
+  <Word type="f">Abortuszmaradék</Word>
+  <Word type="m">Abszolút hülye</Word>
+  <Word type="m">Agyalágyult</Word>
+  <Word type="m">Agyatlan</Word>
+  <Word type="m">Agybatetovált</Word>
+  <Word type="m">Ágybavizelős</Word>
+  <Word type="f">Agyfasz</Word>
+  <Word type="f">Agyhalott</Word>
+  <Word type="m">Agyonkúrt</Word>
+  <Word type="m">Agyonvert</Word>
+  <Word type="m">Agyrákos</Word>
+  <Word type="m">AIDS-es</Word>
+  <Word type="m">Alapvetően fasz</Word>
+  <Word type="f">Animalsex-mániás</Word>
+  <Word type="f">Antibarom</Word>
+  <Word type="m">Aprófaszú</Word>
+  <Word type="m">Arcbarakott</Word>
+  <Word type="m">Aszaltfaszú</Word>
+  <Word type="m">Aszott</Word>
+  <Word type="m">Átbaszott</Word>
+  <Word type="f">Azt a kurva de fasz</Word>
+  <Word type="m">Balatonberényben napvilágot látott</Word>
+  <Word type="f">Balfasz</Word>
+  <Word type="f">Balfészek</Word>
+  <Word type="f">Baromfifasz</Word>
+  <Word type="f">Basz-o-matic</Word>
+  <Word type="m">Baszhatatlan</Word>
+  <Word type="m">Basznivaló</Word>
+  <Word type="m">Bebaszott</Word>
+  <Word type="m">Befosi</Word>
+  <Word type="m">Békapicsa</Word>
+  <Word type="m">Bélböfi</Word>
+  <Word type="m">Beleiből kiforgatott</Word>
+  <Word type="f">Bélszél</Word>
+  <Word type="m">Bronz térdű</Word>
+  <Word type="f">Brunya</Word>
+  <Word type="m">Büdös szájú</Word>
+  <Word type="m">Büdösszájú</Word>
+  <Word type="m">Búvalbaszott</Word>
+  <Word type="f">Buzeráns</Word>
+  <Word type="m">Buzernyák</Word>
+  <Word type="f">Buzi</Word>
+  <Word type="f">Buzikurva</Word>
+  <Word type="f">Cafat</Word>
+  <Word type="f">Cafka</Word>
+  <Word type="f">Céda</Word>
+  <Word type="m">Cérnafaszú</Word>
+  <Word type="f">Cottonfej</Word>
+  <Word type="m">Csempe szobában felneveltetett</Word>
+  <Word type="m">Cseszett</Word>
+  <Word type="f">Csibefasz</Word>
+  <Word type="f">Csipszar</Word>
+  <Word type="m">Csirkefaszú</Word>
+  <Word type="f">Csitri</Word>
+  <Word type="f">Csöcs</Word>
+  <Word type="f">Csöcsfej</Word>
+  <Word type="f">Csöppszar</Word>
+  <Word type="m">Csőszkunyhóban elrejtett</Word>
+  <Word type="m">Csupaszfarkú</Word>
+  <Word type="f">Cuncipunci</Word>
+  <Word type="m">Deformáltfaszú</Word>
+  <Word type="m">Dekorált pofájú</Word>
+  <Word type="m">Döbbenetesen segg</Word>
+  <Word type="m">Dobseggű</Word>
+  <Word type="m">Dughatatlan</Word>
+  <Word type="m">Dunyhavalagú</Word>
+  <Word type="m">Duplafaszú</Word>
+  <Word type="f">Ebfasz</Word>
+  <Word type="m">Egyszerűen fasz</Word>
+  <Word type="m">Elbaszott</Word>
+  <Word type="m">Eleve hülye</Word>
+  <Word type="m">Extrahülye</Word>
+  <Word type="m">Fafogú rézfűrésszel megsebzett</Word>
+  <Word type="m">Fantasztikusan segg</Word>
+  <Word type="f">Fasszopó</Word>
+  <Word type="m">Fasz</Word>
+  <Word type="m">Fasz-emulátor</Word>
+  <Word type="m">Faszagyú</Word>
+  <Word type="f">Faszarc</Word>
+  <Word type="f">Faszfej</Word>
+  <Word type="f">Faszfészek</Word>
+  <Word type="f">Faszkalap</Word>
+  <Word type="f">Faszkarika</Word>
+  <Word type="m">Faszkedvelő</Word>
+  <Word type="f">Faszkópé</Word>
+  <Word type="f">Faszogány</Word>
+  <Word type="f">Faszpörgettyű</Word>
+  <Word type="f">Faszsapka</Word>
+  <Word type="m">Faszszagú</Word>
+  <Word type="f">Faszszopó</Word>
+  <Word type="m">Fasztalan</Word>
+  <Word type="f">Fasztarisznya</Word>
+  <Word type="f">Fasztengely</Word>
+  <Word type="f">Fasztolvaj</Word>
+  <Word type="f">Faszváladék</Word>
+  <Word type="f">Faszverő</Word>
+  <Word type="m">Félrebaszott</Word>
+  <Word type="m">Félrefingott</Word>
+  <Word type="m">Félreszart</Word>
+  <Word type="f">Félribanc</Word>
+  <Word type="f">Fing</Word>
+  <Word type="m">Fölcsinált</Word>
+  <Word type="m">Fölfingott</Word>
+  <Word type="f">Fos</Word>
+  <Word type="f">Foskemence</Word>
+  <Word type="f">Fospisztoly</Word>
+  <Word type="f">Fospumpa</Word>
+  <Word type="f">Fostalicska</Word>
+  <Word type="f">Fütyi</Word>
+  <Word type="m">Fütyinyalogató</Word>
+  <Word type="f">Fütykös</Word>
+  <Word type="f">Geci</Word>
+  <Word type="m">Gecinyelő</Word>
+  <Word type="m">Geciszaró</Word>
+  <Word type="m">Geciszívó</Word>
+  <Word type="f">Genny</Word>
+  <Word type="m">Gennyesszájú</Word>
+  <Word type="f">Gennygóc</Word>
+  <Word type="f">Genyac</Word>
+  <Word type="f">Genyó</Word>
+  <Word type="f">Gólyafos</Word>
+  <Word type="m">Görbefaszú</Word>
+  <Word type="m">Gyennyszopó</Word>
+  <Word type="f">Gyíkfing</Word>
+  <Word type="f">Hájpacni</Word>
+  <Word type="f">Hatalmas nagy fasz</Word>
+  <Word type="m">Hátbabaszott</Word>
+  <Word type="f">Házikurva</Word>
+  <Word type="m">Hererákos</Word>
+  <Word type="m">Hígagyú</Word>
+  <Word type="m">Hihetetlenül fasz</Word>
+  <Word type="f">Hikomat</Word>
+  <Word type="f">Hímnőstény</Word>
+  <Word type="f">Hímringyó</Word>
+  <Word type="m">Hiperstrici</Word>
+  <Word type="m">Hitler-imádó</Word>
+  <Word type="m">Hitlerista</Word>
+  <Word type="f">Hivatásos balfasz</Word>
+  <Word type="m">Hú de segg</Word>
+  <Word type="m">Hugyagyú</Word>
+  <Word type="m">Hugyos</Word>
+  <Word type="f">Hugytócsa</Word>
+  <Word type="m">Hüje</Word>
+  <Word type="m">Hüle</Word>
+  <Word type="m">Hülye</Word>
+  <Word type="m">Hülyécske</Word>
+  <Word type="f">Hülyegyerek</Word>
+  <Word type="f">Inkubátor-szökevény</Word>
+  <Word type="f">Integrált barom</Word>
+  <Word type="m">Ionizált faszú</Word>
+  <Word type="f">IQ bajnok</Word>
+  <Word type="f">IQ fighter</Word>
+  <Word type="m">IQ hiányos</Word>
+  <Word type="m">Irdatlanul köcsög</Word>
+  <Word type="m">Íveltfaszú</Word>
+  <Word type="m">Jajj de barom</Word>
+  <Word type="m">Jókora fasz</Word>
+  <Word type="f">Kaka</Word>
+  <Word type="f">Kakamatyi</Word>
+  <Word type="f">Kaki</Word>
+  <Word type="f">Kaksi</Word>
+  <Word type="m">Kecskebaszó</Word>
+  <Word type="m">Kellően fasz</Word>
+  <Word type="m">Képlékeny faszú</Word>
+  <Word type="f">Keresve sem található fasz</Word>
+  <Word type="m">Kétfaszú</Word>
+  <Word type="m">Kétszer agyonbaszott</Word>
+  <Word type="m">Ki-bebaszott</Word>
+  <Word type="m">Kibaszott</Word>
+  <Word type="m">Kifingott</Word>
+  <Word type="m">Kiherélt</Word>
+  <Word type="m">Kikakkantott</Word>
+  <Word type="m">Kikészült</Word>
+  <Word type="m">Kimagaslóan fasz</Word>
+  <Word type="m">Kimondhatatlan pöcs</Word>
+  <Word type="f">Kis szaros</Word>
+  <Word type="f">Kisfütyi</Word>
+  <Word type="m">Klotyószagú</Word>
+  <Word type="m">Ködmönbe bújtatott</Word>
+  <Word type="m">Kojak-faszú</Word>
+  <Word type="m">Kopárfaszú</Word>
+  <Word type="m">Korlátolt gecizésű</Word>
+  <Word type="f">Kotonszökevény</Word>
+  <Word type="m">Középszar</Word>
+  <Word type="f">Kretén</Word>
+  <Word type="f">Kuki</Word>
+  <Word type="f">Kula</Word>
+  <Word type="m">Kunkorított faszú</Word>
+  <Word type="f">Kurva</Word>
+  <Word type="m">Kurvaanyjú</Word>
+  <Word type="f">Kurvapecér</Word>
+  <Word type="f">Kutyakaki</Word>
+  <Word type="f">Kutyapina</Word>
+  <Word type="f">Kutyaszar</Word>
+  <Word type="m">Lankadtfaszú</Word>
+  <Word type="m">Lebaszirgált</Word>
+  <Word type="m">Lebaszott</Word>
+  <Word type="m">Lecseszett</Word>
+  <Word type="m">Leírhatatlanul segg</Word>
+  <Word type="m">Lemenstruált</Word>
+  <Word type="m">Leokádott</Word>
+  <Word type="f">Lepkefing</Word>
+  <Word type="f">Leprafészek</Word>
+  <Word type="m">Leszart</Word>
+  <Word type="m">Leszbikus</Word>
+  <Word type="f">Lőcs</Word>
+  <Word type="f">Lőcsgéza</Word>
+  <Word type="f">Lófasz</Word>
+  <Word type="m">Lógócsöcsű</Word>
+  <Word type="f">Lóhugy</Word>
+  <Word type="f">Lotyó</Word>
+  <Word type="m">Lucskos</Word>
+  <Word type="f">Lugnya</Word>
+  <Word type="m">Lyukasbelű</Word>
+  <Word type="m">Lyukasfaszú</Word>
+  <Word type="m">Lyukát vakaró</Word>
+  <Word type="m">Lyuktalanított</Word>
+  <Word type="f">Mamutsegg</Word>
+  <Word type="f">Maszturbációs görcs</Word>
+  <Word type="f">Maszturbagép</Word>
+  <Word type="m">Maszturbáltatott</Word>
+  <Word type="m">Megfingatott</Word>
+  <Word type="m">Megkettyintett</Word>
+  <Word type="m">Megkúrt</Word>
+  <Word type="m">Megszopatott</Word>
+  <Word type="m">Mesterséges faszú</Word>
+  <Word type="f">Méteres kékeres</Word>
+  <Word type="m">Mikrotökű</Word>
+  <Word type="m">Mocskos</Word>
+  <Word type="f">Mojfing</Word>
+  <Word type="m">Műfaszú</Word>
+  <Word type="f">Muff</Word>
+  <Word type="f">Multifasz</Word>
+  <Word type="m">Műtöttpofájú</Word>
+  <Word type="m">Náci</Word>
+  <Word type="m">Nagyfejű</Word>
+  <Word type="f">Nikotinpatkány</Word>
+  <Word type="m">Nimfomániás</Word>
+  <Word type="f">Nuna</Word>
+  <Word type="f">Nunci</Word>
+  <Word type="f">Nuncóka</Word>
+  <Word type="f">Nyalábfasz</Word>
+  <Word type="f">Nyelestojás</Word>
+  <Word type="f">Nyúlszar</Word>
+  <Word type="f">Oltári nagy fasz</Word>
+  <Word type="m">Ondónyelő</Word>
+  <Word type="m">Orbitálisan hülye</Word>
+  <Word type="m">Ordenálé</Word>
+  <Word type="m">Összebaszott</Word>
+  <Word type="f">Ötcsillagos fasz</Word>
+  <Word type="m">Óvszerezett</Word>
+  <Word type="f">Pénisz</Word>
+  <Word type="m">Peremesfaszú</Word>
+  <Word type="f">Picsa</Word>
+  <Word type="f">Picsafej</Word>
+  <Word type="m">Picsameresztő</Word>
+  <Word type="m">Picsánnyalt</Word>
+  <Word type="m">Picsánrugott</Word>
+  <Word type="m">Picsányi</Word>
+  <Word type="m">Pikkelypáncélt hordó</Word>
+  <Word type="f">Pina</Word>
+  <Word type="f">Pisa</Word>
+  <Word type="m">Pisaszagú</Word>
+  <Word type="m">Pisis</Word>
+  <Word type="f">Pöcs</Word>
+  <Word type="f">Pöcsfej</Word>
+  <Word type="m">Porbafingó</Word>
+  <Word type="f">Pornóbuzi</Word>
+  <Word type="m">Pornómániás</Word>
+  <Word type="m">Pudvás</Word>
+  <Word type="m">Pudváslikú</Word>
+  <Word type="m">Puhafaszú</Word>
+  <Word type="f">Punci</Word>
+  <Word type="f">Puncimókus</Word>
+  <Word type="m">Puncis</Word>
+  <Word type="f">Punciutáló</Word>
+  <Word type="f">Puncivirág</Word>
+  <Word type="f">Qki</Word>
+  <Word type="f">Qrva</Word>
+  <Word type="f">Qtyaszar</Word>
+  <Word type="m">Rabló</Word>
+  <Word type="m">Rágcsáltfaszú</Word>
+  <Word type="f">Redva</Word>
+  <Word type="m">Rendkívül fasz</Word>
+  <Word type="m">Repedtsarkú</Word>
+  <Word type="m">Rétó-román</Word>
+  <Word type="m">Rézhasú</Word>
+  <Word type="f">Ribanc</Word>
+  <Word type="f">Riherongy</Word>
+  <Word type="m">Ritka fogú</Word>
+  <Word type="m">Rivalizáló</Word>
+  <Word type="f">Rőfös fasz</Word>
+  <Word type="m">Rojtospicsájú</Word>
+  <Word type="m">Rongyospinájú</Word>
+  <Word type="m">Roppant hülye</Word>
+  <Word type="f">Rossz kurva</Word>
+  <Word type="m">Saját nemével kefélő</Word>
+  <Word type="f">Segg</Word>
+  <Word type="f">Seggarc</Word>
+  <Word type="f">Seggdugó</Word>
+  <Word type="f">Seggfej</Word>
+  <Word type="f">Seggnyaló</Word>
+  <Word type="f">Seggszőr</Word>
+  <Word type="f">Seggtorlasz</Word>
+  <Word type="m">Sikoltozásokba öltöztetett</Word>
+  <Word type="f">Strici</Word>
+  <Word type="m">Suttyó</Word>
+  <Word type="m">Sutyerák</Word>
+  <Word type="m">Szálkafaszú</Word>
+  <Word type="f">Szar</Word>
+  <Word type="f">Szaralak</Word>
+  <Word type="f">Szárazfing</Word>
+  <Word type="f">Szarbojler</Word>
+  <Word type="f">Szarcsimbók</Word>
+  <Word type="m">Szarevő</Word>
+  <Word type="m">Szarfaszú</Word>
+  <Word type="f">Szarházi</Word>
+  <Word type="f">Szarjankó</Word>
+  <Word type="m">Szarnivaló</Word>
+  <Word type="m">Szarosvalagú</Word>
+  <Word type="m">Szarrá vágott</Word>
+  <Word type="f">Szarrágó</Word>
+  <Word type="m">Szarszagú</Word>
+  <Word type="m">Szarszájú</Word>
+  <Word type="f">Szartragacs</Word>
+  <Word type="f">Szarzsák</Word>
+  <Word type="f">Szégyencsicska</Word>
+  <Word type="m">Szifiliszes</Word>
+  <Word type="f">Szivattyús kurva</Word>
+  <Word type="m">Szófosó</Word>
+  <Word type="m">Szokatlanul fasz</Word>
+  <Word type="f">Szop-o-matic</Word>
+  <Word type="f">Szopógép</Word>
+  <Word type="f">Szopógörcs</Word>
+  <Word type="f">Szopós kurva</Word>
+  <Word type="m">Szopottfarkú</Word>
+  <Word type="m">Szűklyukú</Word>
+  <Word type="m">Szultán udvarát megjárt</Word>
+  <Word type="f">Szúnyogfaszni</Word>
+  <Word type="f">Szuperbuzi</Word>
+  <Word type="f">Szuperkurva</Word>
+  <Word type="m">Szűzhártya-repedéses</Word>
+  <Word type="f">Szűzkurva</Word>
+  <Word type="f">Szűzpicsa</Word>
+  <Word type="f">Szűzpunci</Word>
+  <Word type="m">Tetves</Word>
+  <Word type="f">Tikfos</Word>
+  <Word type="f">Tikszar</Word>
+  <Word type="m">Tompatökű</Word>
+  <Word type="m">Törpefaszú</Word>
+  <Word type="m">Toszatlan</Word>
+  <Word type="m">Toszott</Word>
+  <Word type="m">Totálisan hülye</Word>
+  <Word type="m">Tyű de picsa</Word>
+  <Word type="m">Tyúkfasznyi</Word>
+  <Word type="f">Tyúkszar</Word>
+  <Word type="f">Vadfasz</Word>
+  <Word type="f">Valag</Word>
+  <Word type="f">Valagváladék</Word>
+  <Word type="f">Végbélféreg</Word>
+  <Word type="f">Xar</Word>
+  <Word type="m">Zsugorított faszú</Word>
+</DirtyWords> 
--- a/static/favicon.png
+++ b/static/favicon.png
--- a/static/logo.png
+++ b/static/logo.png
--- a/static/sulik.json
+++ b/static/sulik.json
--- a/static/templates/9suw9suw9/template.css
+++ b/static/templates/9suw9suw9/template.css
@ -0,0 +1,61 @@
+.logo-container {
+    margin-bottom: 2rem;
+    text-align: center;
+    padding: 0 1rem;
+}
+
+.logo {
+    max-width: 100%;
+    height: auto;
+    width: auto;
+    max-height: 120px;
+}
+
+.admin-panel {
+    background-color: white;
+    border-radius: 4px;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+    width: 100%;
+    max-width: 800px;
+    overflow: hidden;
+    margin: 0 1rem;
+}
+
+.login-header {
+    background-color: #30b0d5;
+    color: white;
+    padding: 1rem;
+    text-align: center;
+}
+
+.login-header h2 {
+    font-size: clamp(1rem, 4vw, 1.2rem);
+    font-weight: normal;
+    margin: 0;
+    line-height: 1.3;
+}
+
+.gif-container {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 1rem;
+    background-color: white;
+}
+
+.gif-image {
+    max-width: 100%;
+    height: auto;
+    object-fit: contain;
+    display: block;
+}
+
+@media (max-width: 640px) {
+    .logo-container {
+        margin-bottom: 1.5rem;
+    }
+
+    .admin-panel {
+        margin: 0 0.5rem;
+    }
+} 
--- a/static/templates/9suw9suw9/template.html
+++ b/static/templates/9suw9suw9/template.html
@ -0,0 +1,16 @@
+<div class="logo-container">
+    <img src="/logo.png" class="logo" alt="KRETÉN logo">
+</div>
+<div class="login-container admin-panel">
+    <div class="login-header">
+        <h2>9suw9suw9</h2>
+    </div>
+    <div class="login-form" style="padding: 0;">
+        <div class="gif-container">
+            <img src="/templates/_images/9s.gif" alt="9S" class="gif-image" 
+                 onload="this.style.opacity = '1'"
+                 onerror="this.style.display = 'none'"
+                 style="opacity: 0; transition: opacity 0.3s ease; max-width: 100%; height: auto;">
+        </div>
+    </div>
+</div> 
--- a/static/templates/9suw9suw9/template.js
+++ b/static/templates/9suw9suw9/template.js
--- a/static/templates/_images/9s.gif
+++ b/static/templates/_images/9s.gif
--- a/static/templates/_images/klima.png
+++ b/static/templates/_images/klima.png
--- a/static/templates/_images/menczer.jpg
+++ b/static/templates/_images/menczer.jpg
--- a/static/templates/_images/milka.jpg
+++ b/static/templates/_images/milka.jpg
--- a/static/templates/_images/p1.png
+++ b/static/templates/_images/p1.png
--- a/static/templates/_images/p2.png
+++ b/static/templates/_images/p2.png
--- a/static/templates/_images/petiszivem.jpg
+++ b/static/templates/_images/petiszivem.jpg
--- a/static/templates/_images/skelly.jpg
+++ b/static/templates/_images/skelly.jpg
--- a/static/templates/_images/sodinazi.png
+++ b/static/templates/_images/sodinazi.png
--- a/static/templates/_images/tomcica.webp
+++ b/static/templates/_images/tomcica.webp
--- a/static/templates/admin/template.css
+++ b/static/templates/admin/template.css
@ -0,0 +1,196 @@
+.logo-container {
+    margin-bottom: 2rem;
+    text-align: center;
+}
+
+.logo {
+    max-width: 100%;
+    height: auto;
+}
+
+.admin-panel {
+    background-color: white;
+    border-radius: 4px;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+    width: 100%;
+    max-width: 600px;
+    overflow: hidden;
+}
+
+.login-header {
+    background-color: #30b0d5;
+    color: white;
+    padding: 1rem;
+    text-align: center;
+}
+
+.login-header h2 {
+    font-size: 1.2rem;
+    font-weight: normal;
+    margin: 0;
+}
+
+.login-form {
+    padding: 1.5rem;
+}
+
+.admin-buttons {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+    margin: 1rem 0;
+}
+
+.admin-button {
+    background-color: #30b0d5;
+    color: white;
+    border: none;
+    border-radius: 4px;
+    padding: 1rem;
+    font-size: 1rem;
+    cursor: pointer;
+    transition: background-color 0.2s;
+    text-align: center;
+    text-decoration: none;
+    display: block;
+}
+
+.admin-button:hover {
+    background-color: #2698bb;
+}
+
+.delete-button {
+    background-color: #e74c3c;
+}
+
+.delete-button:hover {
+    background-color: #c0392b;
+}
+
+.login-message {
+    background-color: #f8f9fa;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+    padding: 1rem;
+    margin-top: 1.5rem;
+    text-align: center;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 1rem;
+}
+
+.delete-success {
+    background-color: #d4edda;
+    border-color: #c3e6cb;
+    color: #155724;
+    padding: 1rem;
+    margin-top: 1.5rem;
+    text-align: center;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 1rem;
+    display: none;
+}
+
+.spinner {
+    width: 40px;
+    height: 40px;
+    border: 4px solid rgba(0, 0, 0, 0.1);
+    border-radius: 50%;
+    border-top-color: #30b0d5;
+    animation: spin 1s ease-in-out infinite;
+}
+
+.modal-backdrop {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-color: rgba(0, 0, 0, 0.5);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    z-index: 1000;
+}
+
+.modal-content {
+    background-color: white;
+    border-radius: 4px;
+    width: 90%;
+    max-width: 600px;
+    max-height: 90vh;
+    overflow-y: auto;
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
+}
+
+.modal-header {
+    background-color: #30b0d5;
+    color: white;
+    padding: 1rem;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+
+.modal-close {
+    background: none;
+    border: none;
+    color: white;
+    font-size: 1.5rem;
+    cursor: pointer;
+    padding: 0.3rem;
+    line-height: 1;
+    width: 36px;
+    height: 36px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    touch-action: manipulation;
+    -webkit-tap-highlight-color: transparent;
+}
+
+.modal-body {
+    padding: 1.5rem;
+}
+
+.env-content {
+    background-color: #f8f9fa;
+    padding: 1rem;
+    border-radius: 4px;
+    white-space: pre-wrap;
+    font-family: monospace;
+    font-size: 0.9rem;
+    overflow-x: auto;
+}
+
+@keyframes spin {
+    to { transform: rotate(360deg); }
+}
+
+@media (max-width: 640px) {
+    .logo {
+        width: 80%;
+        max-width: 300px;
+        margin: 0 auto;
+    }
+
+    .logo-container {
+        margin-bottom: 1.5rem;
+    }
+
+    .admin-buttons {
+        padding: 0;
+    }
+
+    .admin-button {
+        font-size: 0.9rem;
+        padding: 0.8rem;
+    }
+
+    .login-header h2 {
+        font-size: 1rem;
+    }
+} 
--- a/static/templates/admin/template.html
+++ b/static/templates/admin/template.html
@ -0,0 +1,30 @@
+<div class="logo-container">
+    <img src="/logo.png" class="logo" alt="KRETÉN logo">
+</div>
+<div class="login-container admin-panel">
+    <div class="login-header">
+        <h2>Admin Panel</h2>
+    </div>
+    <div class="login-form">
+        <div class="admin-buttons">
+            <button class="admin-button" id="showEnvButton">
+                .env fájl megtekintése
+            </button>
+            <button class="admin-button delete-button" id="deleteDbButton">
+                Egész adatbázis törlése
+            </button>
+            <button id="backToLogin" class="admin-button">Vissza a bejelentkezéshez</button> 
+        </div>
+        <div id="envContentContainer" style="display: none; margin-top: 1rem; background-color: #f0f0f0; padding: 10px; border-radius: 4px; border: 1px solid #ccc;">
+            <h3>.env tartalom:</h3>
+            <pre class="env-pre"><code></code></pre>
+        </div>
+        <div id="loginMessage" class="login-message" style="display: none;">
+            <p id="messageText"></p>
+            <div id="messageSpinner" class="spinner"></div>
+        </div>
+        <div id="deleteSuccess" class="delete-success" style="display: none;">
+            <p>Az adatbázis törlése sikeres volt!</p>
+        </div>
+    </div>
+</div> 
--- a/static/templates/admin/template.js
+++ b/static/templates/admin/template.js
@ -0,0 +1,22 @@
+
+
+document.getElementById('deleteDbButton').addEventListener('click', function() {
+    const messageDiv = document.getElementById('loginMessage');
+    const messageText = document.getElementById('messageText');
+    const spinner = document.getElementById('messageSpinner');
+    const adminButtons = document.querySelector('.admin-buttons');
+    const deleteSuccess = document.getElementById('deleteSuccess');
+    
+    messageDiv.style.display = 'flex';
+    messageText.textContent = "Adatbázis törlése folyamatban...";
+    spinner.style.display = 'block';
+    
+    setTimeout(() => {
+        messageDiv.style.display = 'none';
+        deleteSuccess.style.display = 'flex';
+        
+        setTimeout(() => {
+            window.location.href = '/non-existent-page';
+        }, 2500);
+    }, 2000);
+}); 
--- a/static/templates/arad/template.css
+++ b/static/templates/arad/template.css
@ -0,0 +1,61 @@
+.logo-container {
+    margin-bottom: 2rem;
+    text-align: center;
+    padding: 0 1rem;
+}
+
+.logo {
+    max-width: 100%;
+    height: auto;
+    width: auto;
+    max-height: 120px;
+}
+
+.admin-panel {
+    background-color: white;
+    border-radius: 4px;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+    width: 100%;
+    max-width: 600px;
+    overflow: hidden;
+    margin: 0 1rem;
+}
+
+.login-header {
+    background-color: #30b0d5;
+    color: white;
+    padding: 1rem;
+    text-align: center;
+}
+
+.login-header h2 {
+    font-size: clamp(1rem, 4vw, 1.2rem);
+    font-weight: normal;
+    margin: 0;
+    line-height: 1.3;
+}
+
+.peti-container {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 0;
+    background-color: white;
+}
+
+.peti-image {
+    max-width: 100%;
+    height: auto;
+    object-fit: contain;
+    display: block;
+}
+
+@media (max-width: 640px) {
+    .logo-container {
+        margin-bottom: 1.5rem;
+    }
+
+    .admin-panel {
+        margin: 0 0.5rem;
+    }
+} 
--- a/static/templates/arad/template.html
+++ b/static/templates/arad/template.html
@ -0,0 +1,19 @@
+<div class="logo-container">
+    <img src="/logo.png" class="logo" alt="KRETÉN logo">
+</div>
+<div class="login-container admin-panel">
+    <div class="login-header">
+        <h2>Peti Szívem ❤️</h2>
+    </div>
+    <div class="login-form" style="padding: 0;">
+        <div class="peti-container">
+            <img src="/templates/_images/petiszivem.jpg" alt="Peti Szívem" class="peti-image" 
+                 onload="this.style.opacity = '1'"
+                 onerror="this.style.display = 'none'; document.querySelector('.peti-error').style.display = 'block';"
+                 style="opacity: 0; transition: opacity 0.3s ease; max-width: 100%; height: auto;">
+            <div class="peti-error" style="display: none; color: #e74c3c; padding: 1rem; text-align: center;">
+                Nem sikerült betölteni a képet.
+            </div>
+        </div>
+    </div>
+</div> 
--- a/static/templates/arad/template.js
+++ b/static/templates/arad/template.js
--- a/static/templates/klima/template.css
+++ b/static/templates/klima/template.css
@ -0,0 +1,31 @@
+.logo-container {
+    margin-bottom: 2rem;
+    text-align: center;
+}
+
+.logo {
+    max-width: 100%;
+    height: auto;
+}
+
+.admin-panel {
+    background-color: white;
+    border-radius: 4px;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+    width: 100%;
+    max-width: 600px;
+    overflow: hidden;
+}
+
+.login-header {
+    background-color: #30b0d5;
+    color: white;
+    padding: 1rem;
+    text-align: center;
+}
+
+.login-header h2 {
+    font-size: 1.2rem;
+    font-weight: normal;
+    margin: 0;
+} 
--- a/static/templates/klima/template.html
+++ b/static/templates/klima/template.html
@ -0,0 +1,13 @@
+<div class="logo-container">
+    <img src="/logo.png" class="logo" alt="KRETÉN logo">
+</div>
+<div class="login-container admin-panel">
+    <div class="login-header">
+        <h2>Production adatbázis/adatvédelem final boss</h2>
+    </div>
+    <div class="login-form" style="padding: 0;">
+        <img src="/templates/_images/klima.png" alt="Klíma" style="max-width: 100%; height: auto; display: block;" 
+             onload="this.style.display = 'block'"
+             onerror="this.style.display = 'none'">
+    </div>
+</div> 
--- a/static/templates/klima/template.js
+++ b/static/templates/klima/template.js
--- a/static/templates/menczer/template.css
+++ b/static/templates/menczer/template.css
@ -0,0 +1,61 @@
+.logo-container {
+    margin-bottom: 2rem;
+    text-align: center;
+    padding: 0 1rem;
+}
+
+.logo {
+    max-width: 100%;
+    height: auto;
+    width: auto;
+    max-height: 120px;
+}
+
+.admin-panel {
+    background-color: white;
+    border-radius: 4px;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+    width: 100%;
+    max-width: 600px;
+    overflow: hidden;
+    margin: 0 1rem;
+}
+
+.login-header {
+    background-color: #30b0d5;
+    color: white;
+    padding: 1rem;
+    text-align: center;
+}
+
+.login-header h2 {
+    font-size: clamp(1rem, 4vw, 1.2rem);
+    font-weight: normal;
+    margin: 0;
+    line-height: 1.3;
+}
+
+.menczer-container {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 0;
+    background-color: white;
+}
+
+.menczer-image {
+    max-width: 100%;
+    height: auto;
+    object-fit: contain;
+    display: block;
+}
+
+@media (max-width: 640px) {
+    .logo-container {
+        margin-bottom: 1.5rem;
+    }
+
+    .admin-panel {
+        margin: 0 0.5rem;
+    }
+} 
--- a/static/templates/menczer/template.html
+++ b/static/templates/menczer/template.html
@ -0,0 +1,19 @@
+<div class="logo-container">
+    <img src="/logo.png" class="logo" alt="KRETÉN logo">
+</div>
+<div class="login-container admin-panel">
+    <div class="login-header">
+        <h2>Menczer Tamás</h2>
+    </div>
+    <div class="login-form" style="padding: 0;">
+        <div class="menczer-container">
+            <img src="/templates/_images/menczer.jpg" alt="Menczer Tamás" class="menczer-image" 
+                 onload="this.style.opacity = '1'"
+                 onerror="this.style.display = 'none'; document.querySelector('.error-message').style.display = 'block';"
+                 style="opacity: 0; transition: opacity 0.3s ease; max-width: 100%; height: auto;">
+            <div class="error-message" style="display: none; color: #e74c3c; padding: 1rem; text-align: center;">
+                Nem sikerült betölteni a képet.
+            </div>
+        </div>
+    </div>
+</div> 
--- a/static/templates/menczer/template.js
+++ b/static/templates/menczer/template.js
--- a/static/templates/pearoo/template.css
+++ b/static/templates/pearoo/template.css
@ -0,0 +1,70 @@
+.logo-container {
+    margin-bottom: 2rem;
+    text-align: center;
+    padding: 0 1rem;
+}
+
+.logo {
+    max-width: 100%;
+    height: auto;
+    width: auto;
+    max-height: 120px;
+}
+
+.admin-panel {
+    background-color: white;
+    border-radius: 4px;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+    width: 100%;
+    max-width: 800px;
+    overflow: hidden;
+    margin: 0 1rem;
+}
+
+.login-header {
+    background-color: #30b0d5;
+    color: white;
+    padding: 1rem;
+    text-align: center;
+}
+
+.login-header h2 {
+    font-size: clamp(1rem, 4vw, 1.2rem);
+    font-weight: normal;
+    margin: 0;
+    line-height: 1.3;
+}
+
+.pearoo-images {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 1rem;
+    padding: 1rem;
+    background-color: white;
+}
+
+.pearoo-image {
+    max-width: calc(50% - 0.5rem);
+    height: auto;
+    object-fit: contain;
+    display: block;
+}
+
+@media (max-width: 640px) {
+    .logo-container {
+        margin-bottom: 1.5rem;
+    }
+
+    .admin-panel {
+        margin: 0 0.5rem;
+    }
+
+    .pearoo-images {
+        flex-direction: column;
+    }
+
+    .pearoo-image {
+        max-width: 100%;
+    }
+} 
--- a/static/templates/pearoo/template.html
+++ b/static/templates/pearoo/template.html
@ -0,0 +1,20 @@
+<div class="logo-container">
+    <img src="/logo.png" class="logo" alt="KRETÉN logo">
+</div>
+<div class="login-container admin-panel">
+    <div class="login-header">
+        <h2>pearoo</h2>
+    </div>
+    <div class="login-form" style="padding: 0;">
+        <div class="pearoo-images">
+            <img src="/templates/_images/p1.png" alt="P1" class="pearoo-image" 
+                 onload="this.style.opacity = '1'"
+                 onerror="this.style.display = 'none'"
+                 style="opacity: 0; transition: opacity 0.3s ease; max-width: 100%; height: auto;">
+            <img src="/templates/_images/p2.png" alt="P2" class="pearoo-image" 
+                 onload="this.style.opacity = '1'"
+                 onerror="this.style.display = 'none'"
+                 style="opacity: 0; transition: opacity 0.3s ease; max-width: 100%; height: auto;">
+        </div>
+    </div>
+</div> 
--- a/static/templates/pearoo/template.js
+++ b/static/templates/pearoo/template.js
@ -0,0 +1 @@
+// Images are now loaded directly via src attribute in template.html
--- a/static/templates/skelly/template.css
+++ b/static/templates/skelly/template.css
@ -0,0 +1,183 @@
+.logo-container {
+    margin-bottom: 2rem;
+    text-align: center;
+    padding: 0 1rem;
+}
+
+.logo {
+    max-width: 100%;
+    height: auto;
+    width: auto;
+    max-height: 120px;
+}
+
+.admin-panel {
+    background-color: white;
+    border-radius: 4px;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+    width: 100%;
+    max-width: 600px;
+    overflow: hidden;
+    margin: 0 1rem;
+}
+
+.login-header {
+    background-color: #30b0d5;
+    color: white;
+    padding: 1rem;
+    text-align: center;
+}
+
+.login-header h2 {
+    font-size: clamp(1rem, 4vw, 1.2rem);
+    font-weight: normal;
+    margin: 0;
+    line-height: 1.3;
+}
+
+.login-form {
+    padding: 1.5rem;
+}
+
+.admin-buttons {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 1rem;
+    margin: 1rem 0;
+}
+
+.skelly-2fa-container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 0.5rem;
+    width: 100%;
+    max-width: 300px;
+}
+
+.admin-button {
+    background-color: #30b0d5;
+    color: white;
+    border: none;
+    border-radius: 4px;
+    padding: 1rem;
+    font-size: 1rem;
+    cursor: pointer;
+    transition: background-color 0.2s;
+    text-align: center;
+    text-decoration: none;
+    display: block;
+    width: 100%;
+}
+
+.small-button {
+    padding: 0.5rem;
+    font-size: 0.9rem;
+    width: 120px;
+}
+
+.admin-button:hover {
+    background-color: #2698bb;
+}
+
+.form-input {
+    width: 200px;
+    padding: 0.5rem;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+    font-size: 0.9rem;
+    text-align: center;
+}
+
+.modal-backdrop {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-color: rgba(0, 0, 0, 0.8);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    z-index: 1000;
+}
+
+.modal-content {
+    background-color: black;
+    border-radius: 4px;
+    width: min(400px, 95%);
+    height: min(600px, 90%);
+    max-width: none;
+    max-height: none;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    position: relative;
+}
+
+.modal-header {
+    background-color: #30b0d5;
+    color: white;
+    padding: 0.5rem;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    min-height: 40px;
+}
+
+.modal-close {
+    background: none;
+    border: none;
+    color: white;
+    font-size: 1.5rem;
+    cursor: pointer;
+    padding: 0.3rem;
+    line-height: 1;
+    width: 36px;
+    height: 36px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.modal-body {
+    flex: 1;
+    padding: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    overflow: hidden;
+    background-color: #000;
+}
+
+.modal-image {
+    max-width: 100%;
+    max-height: 100%;
+    width: auto;
+    height: auto;
+    object-fit: contain;
+    display: block;
+}
+
+@media (max-width: 640px) {
+    .logo-container {
+        margin-bottom: 1.5rem;
+    }
+
+    .admin-panel {
+        margin: 0 0.5rem;
+    }
+
+    .login-form {
+        padding: 1rem;
+    }
+}
+
+.skelly-2fa-container form {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 0.5rem;
+    width: 100%;
+} 
--- a/static/templates/skelly/template.html
+++ b/static/templates/skelly/template.html
@ -0,0 +1,21 @@
+<div class="logo-container">
+    <img src="/logo.png" class="logo" alt="KRETÉN logo">
+</div>
+<div class="login-container admin-panel">
+    <div class="login-header">
+        <h2>szia pearoo skelly vagyok</h2>
+    </div>
+    <div class="login-form">
+        <div class="admin-buttons">
+            <div class="skelly-2fa-container">
+                <form id="skelly2FAForm" onsubmit="return false;">
+                    <input type="password" id="skelly2FAInput" placeholder="második jelszó :3" class="form-input">
+                    <button type="submit" id="skelly2FASubmit" class="admin-button small-button">ellenőriz</button>
+                </form>
+            </div>
+            <div id="skellyButtonContainer" style="display: none;">
+                <button class="admin-button" id="showSkellyButton">:3</button>
+            </div>
+        </div>
+    </div>
+</div> 
--- a/static/templates/skelly/template.js
+++ b/static/templates/skelly/template.js
@ -0,0 +1,96 @@
+async function hash(str) {
+    const msgBuffer = new TextEncoder().encode(str);
+    const hashBuffer = await crypto.subtle.digest('SHA-256', msgBuffer);
+    return Array.from(new Uint8Array(hashBuffer))
+        .map(b => b.toString(16).padStart(2, '0'))
+        .join('');
+}
+async function check2FAPassword() {
+    const secondPassword = document.getElementById('skelly2FAInput').value;
+    
+    if (secondPassword === 'meow') {
+        try {
+            const response = await fetch('/api/login', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json'
+                },
+                body: JSON.stringify({ 
+                    username: 'skelly', 
+                    password: 'skelly',
+                    action: 'get_skelly'
+                })
+            });
+
+            const data = await response.json();
+            
+            if (data.success) {
+                document.querySelector('.skelly-2fa-container').style.display = 'none';
+                document.getElementById('skellyButtonContainer').style.display = 'block';
+            } else {
+                alert('hiba történt >:3');
+            }
+        } catch (error) {
+            console.error('Error:', error);
+            alert('hiba történt >:3');
+        }
+    } else {
+        alert('rossz jelszó >:3');
+    }
+}
+
+document.getElementById('skelly2FAForm').addEventListener('submit', function(e) {
+    e.preventDefault();
+    check2FAPassword();
+});
+
+document.getElementById('skelly2FASubmit').addEventListener('click', function(e) {
+    e.preventDefault();
+    check2FAPassword();
+});
+
+document.getElementById('showSkellyButton').addEventListener('click', async function() {
+    try {
+        const skellyModal = document.createElement('div');
+        skellyModal.className = 'modal-backdrop';
+        skellyModal.innerHTML = `
+            <div class="modal-content" onclick="event.stopPropagation()">
+                <div class="modal-header">
+                    <h3 style="font-family: Arial, sans-serif; font-weight: normal; font-size: 1.2rem; margin: 0;">:3</h3>
+                    <button class="modal-close">×</button>
+                </div>
+                <div class="modal-body">
+                    <img alt="Skelly" class="modal-image" 
+                         onload="this.style.opacity = '1'"
+                         onerror="this.style.display = 'none'"
+                         style="opacity: 0; transition: opacity 0.3s ease;">
+                </div>
+            </div>
+        `;
+        
+        document.body.appendChild(skellyModal);
+
+        const img = skellyModal.querySelector('.modal-image');
+        img.src = '/templates/_images/skelly.jpg';
+        
+        const closeModal = () => {
+            document.body.removeChild(skellyModal);
+            document.body.style.overflow = '';
+            document.removeEventListener('keydown', handleEscape);
+        };
+        
+        skellyModal.querySelector('.modal-close').addEventListener('click', closeModal);
+        skellyModal.addEventListener('click', closeModal);
+
+        document.body.style.overflow = 'hidden';
+        
+        const handleEscape = (e) => {
+            if (e.key === 'Escape') {
+                closeModal();
+            }
+        };
+        document.addEventListener('keydown', handleEscape);
+    } catch (error) {
+        console.error('Error loading Skelly:', error);
+    }
+}); 
--- a/static/templates/sodika/template.css
+++ b/static/templates/sodika/template.css
@ -0,0 +1,87 @@
+.login-form {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+}
+.logo-container {
+    margin-bottom: 2rem;
+    text-align: center;
+    padding: 0 1rem;
+}
+
+.logo {
+    max-width: 100%;
+    height: auto;
+    width: auto;
+    max-height: 120px;
+}
+
+.admin-panel {
+    background-color: white;
+    border-radius: 4px;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+    width: 100%;
+    max-width: 600px;
+    overflow: hidden;
+    margin: 0 1rem;
+}
+
+.login-header {
+    background-color: #30b0d5;
+    color: white;
+    padding: 1rem;
+    text-align: center;
+}
+
+.login-header h2 {
+    font-size: clamp(1rem, 4vw, 1.2rem);
+    font-weight: normal;
+    margin: 0;
+    line-height: 1.3;
+}
+
+.sodika-container {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 0;
+    background-color: white;
+}
+
+.sodika-image {
+    max-width: 100%;
+    height: auto;
+    object-fit: contain;
+    display: block;
+}
+
+.sodika-button {
+    background-color: #30b0d5;
+    color: white;
+    border: none;
+    border-radius: 4px;
+    padding: 1rem;
+    font-size: 1rem;
+    cursor: pointer;
+    transition: background-color 0.2s;
+    text-align: center;
+    text-decoration: none;
+    display: block;
+    margin-top: 1rem;
+    margin-bottom: 1rem;
+    justify-content: center;
+    align-items: center;
+    width: 80%; /* Adjusted width */
+    max-width: 300px; /* Added max-width */
+}
+
+@media (max-width: 640px) {
+    .logo-container {
+        margin-bottom: 1.5rem;
+    }
+
+    .admin-panel {
+        margin: 0 0.5rem;
+    }
+} 
--- a/static/templates/sodika/template.html
+++ b/static/templates/sodika/template.html
@ -0,0 +1,22 @@
+<div class="logo-container">
+    <img src="/logo.png" class="logo" alt="KRETÉN logo">
+</div>
+<div class="login-container admin-panel">
+    <div class="login-header">
+        <h2>Kiss Endre Farkas</h2>
+    </div>
+    <div class="login-form" style="padding: 0;">
+        <div class="sodika-container">
+            <img src="/templates/_images/sodinazi.png" alt="Kiss Endre Farkas" class="sodika-image" 
+                 onload="this.style.opacity = '1'"
+                 onerror="this.style.display = 'none'; document.querySelector('.sodika-error').style.display = 'block';"
+                 style="opacity: 0; transition: opacity 0.3s ease; max-width: 100%; height: auto;">
+            <div class="sodika-error" style="display: none; color: #e74c3c; padding: 1rem; text-align: center;">
+                Nem sikerült betölteni a képet.
+            </div>
+        </div>
+         <button class="sodika-button" onclick="window.location.href='https://pub-e0f5a388c46c49d0b01b8999c3b13da3.r2.dev/lesmAcLon-.mp4'">Ezt érdemes megnézni</button>
+         <button class="sodika-button" onclick="window.location.href='https://sodipedia.sodika.org/wiki/Sz%C3%B3cikkek'">Sodika</button>
+        
+    </div>
+</div> 
--- a/static/templates/sodika/template.js
+++ b/static/templates/sodika/template.js
--- a/static/templates/tomcat/template.css
+++ b/static/templates/tomcat/template.css
@ -0,0 +1,61 @@
+.logo-container {
+    margin-bottom: 2rem;
+    text-align: center;
+    padding: 0 1rem;
+}
+
+.logo {
+    max-width: 100%;
+    height: auto;
+    width: auto;
+    max-height: 120px;
+}
+
+.admin-panel {
+    background-color: white;
+    border-radius: 4px;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+    width: 100%;
+    max-width: 600px;
+    overflow: hidden;
+    margin: 0 1rem;
+}
+
+.login-header {
+    background-color: #30b0d5;
+    color: white;
+    padding: 1rem;
+    text-align: center;
+}
+
+.login-header h2 {
+    font-size: clamp(1rem, 4vw, 1.2rem);
+    font-weight: normal;
+    margin: 0;
+    line-height: 1.3;
+}
+
+.tomcat-container {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 0;
+    background-color: white;
+}
+
+.tomcat-image {
+    max-width: 100%;
+    height: auto;
+    object-fit: contain;
+    display: block;
+}
+
+@media (max-width: 640px) {
+    .logo-container {
+        margin-bottom: 1.5rem;
+    }
+
+    .admin-panel {
+        margin: 0 0.5rem;
+    }
+} 
--- a/static/templates/tomcat/template.html
+++ b/static/templates/tomcat/template.html
@ -0,0 +1,19 @@
+<div class="logo-container">
+    <img src="/logo.png" class="logo" alt="KRETÉN logo">
+</div>
+<div class="login-container admin-panel">
+    <div class="login-header">
+        <h2>Tomcica</h2>
+    </div>
+    <div class="login-form" style="padding: 0;">
+        <div class="tomcat-container">
+            <img src="/templates/_images/tomcica.webp" alt="Tomcica" class="tomcat-image" 
+                 onload="this.style.opacity = '1'"
+                 onerror="this.style.display = 'none'; document.querySelector('.tomcat-error').style.display = 'block';"
+                 style="opacity: 0; transition: opacity 0.3s ease; max-width: 100%; height: auto;">
+            <div class="tomcat-error" style="display: none; color: #e74c3c; padding: 1rem; text-align: center;">
+                Nem sikerült betölteni a cicát.
+            </div>
+        </div>
+    </div>
+</div> 
--- a/static/templates/tomcat/template.js
+++ b/static/templates/tomcat/template.js
--- a/static/templates/wide_gold_storage_silo/template.css
+++ b/static/templates/wide_gold_storage_silo/template.css
@ -0,0 +1,166 @@
+.logo-container {
+    margin-bottom: 2rem;
+    text-align: center;
+    padding: 0 1rem;
+}
+
+.logo {
+    max-width: 100%;
+    height: auto;
+    width: auto;
+    max-height: 120px;
+}
+
+.admin-panel {
+    background-color: white;
+    border-radius: 4px;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+    width: 100%;
+    max-width: 600px;
+    overflow: hidden;
+    margin: 0 1rem;
+}
+
+.login-header {
+    background-color: #30b0d5;
+    color: white;
+    padding: 1rem;
+    text-align: center;
+}
+
+.login-header h2 {
+    font-size: clamp(1rem, 4vw, 1.2rem);
+    font-weight: normal;
+    margin: 0;
+    line-height: 1.3;
+}
+
+.login-form {
+    padding: 1.5rem;
+}
+
+.admin-buttons {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+    margin: 1rem 0;
+}
+
+.admin-button {
+    background-color: #30b0d5;
+    color: white;
+    border: none;
+    border-radius: 4px;
+    padding: 1rem;
+    font-size: 1rem;
+    cursor: pointer;
+    transition: background-color 0.2s;
+    text-align: center;
+    text-decoration: none;
+    display: block;
+}
+
+.admin-button:hover {
+    background-color: #2698bb;
+}
+
+.modal-backdrop {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-color: rgba(0, 0, 0, 0.8);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    z-index: 1000;
+    padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
+}
+
+.modal-content {
+    background-color: black;
+    border-radius: 4px;
+    width: min(800px, 95%);
+    height: min(600px, 90%);
+    max-width: none;
+    max-height: none;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    position: relative;
+}
+
+.modal-header {
+    background-color: #30b0d5;
+    color: white;
+    padding: 0.5rem;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    min-height: 40px;
+}
+
+.modal-close {
+    background: none;
+    border: none;
+    color: white;
+    font-size: 1.5rem;
+    cursor: pointer;
+    padding: 0.3rem;
+    line-height: 1;
+    width: 36px;
+    height: 36px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    touch-action: manipulation;
+    -webkit-tap-highlight-color: transparent;
+}
+
+.modal-body {
+    flex: 1;
+    padding: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    overflow: hidden;
+    background-color: #000;
+}
+
+.modal-image {
+    max-width: 100%;
+    max-height: 100%;
+    width: auto;
+    height: auto;
+    object-fit: contain;
+    display: block;
+}
+
+@media (max-width: 640px) {
+    .logo-container {
+        margin-bottom: 1.5rem;
+    }
+
+    .admin-panel {
+        margin: 0 0.5rem;
+    }
+
+    .login-form {
+        padding: 1rem;
+    }
+
+    .modal-content {
+        width: 100%;
+        height: 100%;
+        border-radius: 0;
+    }
+
+    .modal-header {
+        padding: 0.5rem;
+    }
+
+    .modal-close {
+        font-size: 1.5rem;
+    }
+} 
--- a/static/templates/wide_gold_storage_silo/template.html
+++ b/static/templates/wide_gold_storage_silo/template.html
@ -0,0 +1,15 @@
+<div class="logo-container">
+    <img src="/logo.png" class="logo" alt="KRETÉN logo">
+</div>
+<div class="login-container admin-panel">
+    <div class="login-header">
+        <h2>wide_gold_storage_silo</h2>
+    </div>
+    <div class="login-form">
+        <div class="admin-buttons">
+            <button class="admin-button" id="showMilkaButton">
+                Milka csoki for everyone
+            </button>
+        </div>
+    </div>
+</div> 
--- a/static/templates/wide_gold_storage_silo/template.js
+++ b/static/templates/wide_gold_storage_silo/template.js
@ -0,0 +1,60 @@
+document.getElementById('showMilkaButton').addEventListener('click', async function() {
+    try {
+        const milkaModal = document.createElement('div');
+        milkaModal.className = 'modal-backdrop';
+        milkaModal.innerHTML = `
+            <div class="modal-content" onclick="event.stopPropagation()">
+                <div class="modal-header">
+                    <h3 style="font-family: Arial, sans-serif; font-weight: normal; font-size: 1.2rem; margin: 0;">wide_gold_storage_silo</h3>
+                    <button class="modal-close">×</button>
+                </div>
+                <div class="modal-body">
+                    <img alt="Milka" class="modal-image" 
+                         onload="this.style.opacity = '1'"
+                         onerror="this.style.display = 'none'"
+                         style="opacity: 0; transition: opacity 0.3s ease;">
+                </div>
+            </div>
+        `;
+        
+        document.body.appendChild(milkaModal);
+
+        // Load image with authentication
+        const img = milkaModal.querySelector('.modal-image');
+        fetch('/api/protected-image?image=milka.jpg', {
+            headers: {
+                'x-auth': 'milka-authenticated'
+            }
+        })
+        .then(response => response.blob())
+        .then(blob => {
+            img.src = URL.createObjectURL(blob);
+        })
+        .catch(error => {
+            console.error('Error loading image:', error);
+            img.style.display = 'none';
+        });
+        
+        const closeModal = () => {
+            document.body.removeChild(milkaModal);
+            document.body.style.overflow = ''; // Restore scroll
+            document.removeEventListener('keydown', handleEscape); // Clean up listener
+        };
+        
+        milkaModal.querySelector('.modal-close').addEventListener('click', closeModal);
+        milkaModal.addEventListener('click', closeModal); // Close on backdrop click
+
+        // Prevent scrolling when modal is open
+        document.body.style.overflow = 'hidden';
+        
+        // Handle escape key
+        const handleEscape = (e) => {
+            if (e.key === 'Escape') {
+                closeModal();
+            }
+        };
+        document.addEventListener('keydown', handleEscape);
+    } catch (error) {
+        console.error('Error loading Milka:', error);
+    }
+}); 
--- a/svelte.config.js
+++ b/svelte.config.js
@ -0,0 +1,11 @@
+import adapter from '@sveltejs/adapter-auto';
+
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
+	kit: {
+		// adapter-auto supports various environments and will automatically choose the right adapter
+		adapter: adapter()
+	}
+};
+
+export default config;
--- a/update.sh
+++ b/update.sh
@ -0,0 +1 @@
+git pull && npm run build && pm2 restart ekreten
--- a/vite.config.js
+++ b/vite.config.js
@ -0,0 +1,9 @@
+import { sveltekit } from '@sveltejs/kit/vite';
+import { defineConfig } from 'vite';
+
+export default defineConfig({
+  plugins: [sveltekit()],
+  preview: {
+    allowedHosts: ['ekreten.hu'] 
+  }
+});
				`@ -0,0 +1 @@`
				// place files you want to import through the `$lib` alias in this folder.
				`@ -0,0 +1 @@`
				`// Images are now loaded directly via src attribute in template.html`
				`@ -0,0 +1 @@`
				`git pull && npm run build && pm2 restart ekreten`