2026-04-15 19:54:38 +00:00
<!doctype html> < html lang = de-de > < head > < meta charset = UTF-8 > < meta name = viewport content = "width=device-width,initial-scale=1" > < title > The n8n Resurrection | DIGITALE ANARCHIE | KI-LABOR< / title > < link rel = stylesheet href = /css/style.css > < / head > < body > < div class = "bg-gear gear-left" > ⚙< / div > < div class = "bg-gear gear-right" > ⚙< / div > < script > document . body . classList . add ( "js-enabled" ) < / script > < header class = main-header > < / header > < main class = container > < div id = declassified-overlay > < div class = scanlines > < / div > < div id = declassified-stamp > ZUGANG< br > GEWÄHRT< / div > < / div > < div class = "person-page-wrapper visible" style = padding-bottom:100px;opacity:1!important > < div class = person-nav-container style = "display:flex;flex-direction:column;align-items:center;gap:20px;margin:15px 0 30px" > < div class = person-nav-row style = display:flex;justify-content:center;align-items:center;gap:35px;flex-wrap:wrap;position:relative > < a href = /personen/mutti/ class = person-nav-item > < div class = person-nav-portrait style = "width:90px;height:90px;border-radius:50%;border:2px solid #d4af37;background:#222;display:flex;align-items:center;justify-content:center;overflow:hidden;color:#d4af37;font-weight:700;font-size:1.2rem;box-shadow:0 0 10px rgba(212,175,55,.2)" > < img src = /img/comicFigures/hp_mutti_comic_1.jpeg alt = MUTTI style = width:100%;height:100%;object-fit:cover > < / div > < span class = person-nav-label style = "margin-top:8px;font-size:.85rem;letter-spacing:1px;color:rgba(212,175,55,.6);font-family:courier new,monospace;font-weight:700" > MUTTI< / span >
< / a > < a href = /personen/vater/ class = person-nav-item > < div class = person-nav-portrait style = "width:90px;height:90px;border-radius:50%;border:2px solid #d4af37;background:#222;display:flex;align-items:center;justify-content:center;overflow:hidden;color:#d4af37;font-weight:700;font-size:1.2rem;box-shadow:0 0 10px rgba(212,175,55,.2)" > < img src = /img/comicFigures/hp_vater_comic_1.png alt = VATER style = width:100%;height:100%;object-fit:cover > < / div > < span class = person-nav-label style = "margin-top:8px;font-size:.85rem;letter-spacing:1px;color:rgba(212,175,55,.6);font-family:courier new,monospace;font-weight:700" > VATER< / span >
< / a > < a href = /personen/bruder/ class = person-nav-item > < div class = person-nav-portrait style = "width:90px;height:90px;border-radius:50%;border:2px solid #d4af37;background:#222;display:flex;align-items:center;justify-content:center;overflow:hidden;color:#d4af37;font-weight:700;font-size:1.2rem;box-shadow:0 0 10px rgba(212,175,55,.2)" > < img src = /img/comicFigures/hp_freddy_comic_1.png alt = BRUDER style = width:100%;height:100%;object-fit:cover > < / div > < span class = person-nav-label style = "margin-top:8px;font-size:.85rem;letter-spacing:1px;color:rgba(212,175,55,.6);font-family:courier new,monospace;font-weight:700" > BRUDER< / span >
< / a > < a href = /personen/schwester/ class = person-nav-item > < div class = person-nav-portrait style = "width:90px;height:90px;border-radius:50%;border:2px solid #d4af37;background:#222;display:flex;align-items:center;justify-content:center;overflow:hidden;color:#d4af37;font-weight:700;font-size:1.2rem;box-shadow:0 0 10px rgba(212,175,55,.2)" > < img src = /img/comicFigures/hp_meli_comic_1.png alt = SCHWESTER style = width:100%;height:100%;object-fit:cover > < / div > < span class = person-nav-label style = "margin-top:8px;font-size:.85rem;letter-spacing:1px;color:rgba(212,175,55,.6);font-family:courier new,monospace;font-weight:700" > SCHWESTER< / span >
< / a > < a href = /personen/sascha/ class = person-nav-item > < div class = person-nav-portrait style = "width:90px;height:90px;border-radius:50%;border:2px solid #d4af37;background:#222;display:flex;align-items:center;justify-content:center;overflow:hidden;color:#d4af37;font-weight:700;font-size:1.2rem;box-shadow:0 0 10px rgba(212,175,55,.2)" > < img src = /img/comicFigures/hp_sascha_comic_1.jpeg alt = SASCHA style = width:100%;height:100%;object-fit:cover > < / div > < span class = person-nav-label style = "margin-top:8px;font-size:.85rem;letter-spacing:1px;color:rgba(212,175,55,.6);font-family:courier new,monospace;font-weight:700" > SASCHA< / span >
< / a > < a href = /personen/sven/ class = person-nav-item > < div class = person-nav-portrait style = "width:90px;height:90px;border-radius:50%;border:2px solid #d4af37;background:#222;display:flex;align-items:center;justify-content:center;overflow:hidden;color:#d4af37;font-weight:700;font-size:1.2rem;box-shadow:0 0 10px rgba(212,175,55,.2)" > < img src = /img/comicFigures/hp_sven_comic_1.jpeg alt = SVEN style = width:100%;height:100%;object-fit:cover > < / div > < span class = person-nav-label style = "margin-top:8px;font-size:.85rem;letter-spacing:1px;color:rgba(212,175,55,.6);font-family:courier new,monospace;font-weight:700" > SVEN< / span > < / a > < / div > < / div > < style > . person-nav-item { display : flex ; flex-direction : column ; align-items : center ; text-decoration : none ; transition : transform .2 s } . person-nav-item : hover { transform : scale ( 1.1 ) } . person-nav-item : hover . person-nav-label { color : #d4af37 !important } . person-back { display : inline-block ; color : rgba ( 212 , 175 , 55 , .6 ) ; font-size : .7 rem ; font-weight : 700 ; letter-spacing : 4 px ; text-decoration : none ; font-family : courier new , monospace ; border : 1 px solid rgba ( 212 , 175 , 55 , .25 ) ; padding : 6 px 20 px ; background : 0 0 ; text-transform : uppercase ; transition : all .2 s } . person-back : hover { color : #d4af37 ; border-color : rgba ( 212 , 175 , 55 , .6 ) ; background : rgba ( 212 , 175 , 55 , 5 % ) ; letter-spacing : 5 px } < / style > < div class = person-hero > < div class = person-hero-content > < div class = person-hero-badges > < span class = hero-badge > ZENTRAL-ARCHIV< / span >
< span class = "hero-badge red" > EINHEIT IDENTIFIZIERT< / span > < / div > < p class = person-pre-label style = "margin:12px 0 4px" > // ZENTRAL-ARCHIV · EINHEIT IDENTIFIZIERT //< / p > < div class = person-title-wrap > < span class = person-title-deco > ⟪< / span > < h1 class = person-glitch-title data-text = "THE N8N RESURRECTION" > THE N8N RESURRECTION< / h1 > < span class = person-title-deco > ⟫< / span > < / div > < p class = person-sub-label > STATUS: < span class = person-status-blink > AKTIV< / span > < / p > < div class = stat-bars > < div class = stat-row > < span class = stat-label > GEFAHR< / span > < div class = stat-track > < div class = "stat-bar danger" data-val = 50 > < / div > < / div > < span class = stat-val > 50%< / span > < / div > < div class = stat-row > < span class = stat-label > STABILITÄT< / span > < div class = stat-track > < div class = "stat-bar stable" data-val = 50 > < / div > < / div > < span class = stat-val > 50%< / span > < / div > < div class = stat-row > < span class = stat-label > CHAOS< / span > < div class = stat-track > < div class = "stat-bar chaos" data-val = 50 > < / div > < / div > < span class = stat-val > 50%< / span > < / div > < div class = stat-row > < span class = stat-label > KOMPETENZ< / span > < div class = stat-track > < div class = "stat-bar kompetenz" data-val = 50 > < / div > < / div > < span class = stat-val > 50%< / span > < / div > < / div > < / div > < / div > < div class = container style = "max-width:900px;margin:0 auto;padding:0 20px" > < header style = margin-bottom:20px;display:none > < / header > < div class = timeline-track > < / div > < div style = text-align:center;margin-top:60px > < button class = akte-label-btn onclick = 'document.getElementById("person-akte-modal").style.display="flex",document.body.style.overflow="hidden"' > < div class = akte-label-top > < span class = akte-label-nr > DOKUMENT-NR. UNBEKANNT< / span >
< span class = akte-label-stamp > VERTRAULICH< / span > < / div > < div class = akte-label-divider > < / div > < div class = akte-label-title > AKTE: THE N8N RESURRECTION< / div > < div class = akte-label-divider > < / div > < div class = akte-label-bottom > < span > STATUS: KLASSIFIZIERT< / span >
< span > ▶ AKTE ÖFFNEN< / span > < / div > < / button > < / div > < style > . akte-label-btn { background : linear-gradient ( 180 deg , #1c1208 0 % , #0e0a04 100 % ) ; border : 1 px solid #5d3d1e ; border-left : 4 px solid #b87333 ; color : #d4af37 ; font-family : courier new , monospace ; cursor : pointer ; padding : 18 px 28 px ; width : 320 px ; text-align : left ; transition : all .2 s ; box-shadow : 2 px 2 px 12 px rgba ( 0 , 0 , 0 , .6 ) ; position : relative } . akte-label-btn :: before { content : '' ; position : absolute ; top : 6 px ; left : 6 px ; right : 6 px ; bottom : 6 px ; border : 1 px dashed rgba ( 184 , 115 , 51 , .2 ) ; pointer-events : none } . akte-label-btn : hover { border-left-color : #ff4500 ; box-shadow : 3 px 3 px 20 px rgba ( 184 , 115 , 51 , .2 ) ; background : linear-gradient ( 180 deg , #221508 0 % , #0e0a04 100 % ) } . akte-label-top { display : flex ; justify-content : space-between ; align-items : center ; margin-bottom : 10 px } . akte-label-nr { font-size : .6 rem ; color : rgba ( 212 , 175 , 55 , .4 ) ; letter-spacing : 1 px } . akte-label-stamp { font-size : .55 rem ; letter-spacing : 2 px ; color : #b71c1c ; border : 1 px solid #b71c1c ; padding : 1 px 6 px ; opacity : .8 } . akte-label-divider { border-top : 1 px solid rgba ( 184 , 115 , 51 , .25 ) ; margin : 8 px 0 } . akte-label-title { font-size : 1 rem ; font-weight : 700 ; letter-spacing : 4 px ; color : #d4af37 ; margin : 4 px 0 } . akte-label-bottom { display : flex ; justify-content : space-between ; font-size : .6 rem ; color : rgba ( 212 , 175 , 55 , .45 ) ; letter-spacing : 1 px ; margin-top : 4 px } . akte-label-btn : hover . akte-label-bottom span : last-child { color : #ff4500 } < / style > < / div > < / div > < div id = person-akte-modal style = position:fixed;inset:0;z-index:1000000;background:rgba(0,0,0,.85);display:none;align-items:center;justify-content:center;padding:10px;overflow:hidden;perspective:1e3px > < div style = display:flex;flex-direction:column;align-items:center;max-width:585px;width:95% > < div class = akte-inner style = "width:100%;background:#d9c5a0;background-image:radial-gradient(circle at 50% 50%,rgba(255,255,255,.1) 0%,transparent 100%),url(https://www.transparenttextures.com/patterns/old-paper.png);border:1px solid #8b7355;padding:25px;position:relative;font-family:courier new,monospace;box-shadow:10px 20px 50px rgba(0,0,0,.8),inset 0 0 100px rgba(139,115,85,.3);transform:rotate(-2deg);animation:throw-sign .5s ease-out forwards;color:#2a1b0a" > < style > @ keyframes throw-sign { 0 % { transform : rotate ( -10 deg ) scale ( .7 ) translateY ( 500 px ) ; opacity : 0 } 100 % { transform : rotate ( -2 deg ) scale ( 1 ) translateY ( 0 ) ; opacity : 1 } } . akte-inner h1 { color : #2a1b0a !important ; font-size : 1.8 rem !important ; margin : 10 px 0 2 px !important ; text-shadow : none !important ; border-bottom : 2 px solid rgba ( 42 , 27 , 10 , .2 ) } . akte-inner div , . akte-inner p { font-size : .75 rem !important } . akte-inner . data-row { border-bottom : 1 px solid rgba ( 42 , 27 , 10 , .1 ) !important ; padding : 6 px 0 !important } . akte-inner . label { color : #5d4037 !important ; font-weight : 700 } . akte-inner . red-stamp { border : 2 px solid #b71c1c ; color : #b71c1c ; padding : 3 px 10 px ; font-weight : 700 ; transform : rotate ( 10 deg ) ; opacity : .8 ; font-size : .8 rem !important ; display : inline-block } < / style > < div style = display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px > < div class = red-stamp > TOP SECRET< / div > < button onclick = 'document.getElementById("person-akte-modal").style.display="none",document.body.style.overflow="auto"' style = "background:rgba(0,0,0,.1);border:1px solid #2a1b0a;color:#2a1b0a;cursor:pointer;padding:3px 10px;font-size:.7rem!important" > [X] SCHLIESSEN< / button > < / div > < div style = display:flex;gap:20px;align-items:flex-start > < div style = "position:relative;border:1px solid #2a1b0a;padding:3px;background:#fff;box-shadow:2px 2px 5px rgba(0,0,0,.2)" > < img src = /img/hero.png class = akte-foto style = width:200px;height:250px;object-fit:cover;filter:none;cursor:zoom-in;display:block onclick = 'document.getElementById("akte-foto-zoom").style.display="flex"' > < div style = "position:absolute;bottom:5px;right:-10px;background:#b71c1c;color:#fff;padding:2px 5px;font-weight:700;font-size:.6rem!important;transform:rotate(-5deg)" > GESPERRT< / div > < / div > < div id = akte-foto-zoom onclick = 'this.style.display="none"' style = display:none;position:fixed;inset:0;z-index:9999999;background:rgba(0,0,0,.92);align-items:center;justify-content:center;cursor:zoom-out > < img src = /img/hero.png style = "max-width:90vw;max-height:90vh;object-fit:contai
< span class = ticker-item style = "font-size:.65rem;letter-spacing:1px;color:rgba(212,175,55,.7);padding:0 30px;text-transform:uppercase" > [ WP-KERN GELÖSCHT // ANARCHIE LEVEL 100 ]< / span > < / div > < / div > < / div > < style > @ keyframes ticker-scroll { 0 % { transform : translateX ( 0 ) } 100 % { transform : translateX ( -50 % ) } } . ticker-item :: before { content : '▶ ' ; color : rgba ( 255 , 69 , 0 , .5 ) } . ticker-track : hover { animation-play-state : paused } < / style > < script > ( function ( ) { const e = document . getElementById ( "ticker-track-global" ) ; if ( ! e ) return ; const t = [ "STATUS: HUGO OPERATIONAL" , "DESIGNATION: OVERLORD SASCHA" , "KAFFEESTAND: KRITISCH" , "ANARCHIE-ENGINE: LÄUFT OHNE WP-BALLAST" , "MISSION: TOTALE KONTROLLE" , "DATENINTEGRITÄT: ABSOLUT" , "WARNUNG: SYSTEM EXTREM SCHNELL" , "GEMINI NEURAL LINK: AKTIV" ] ; e . innerHTML = "" , [ ... t , ... t ] . forEach ( t => { const n = document . createElement ( "span" ) ; n . className = "ticker-item" , n . style . cssText = "font-size:0.65rem; letter-spacing:1px; color:rgba(212,175,55,0.7); padding:0 30px; text-transform:uppercase;" , n . textContent = t , e . appendChild ( n ) } ) } ) ( ) < / script > < script src = /js/script.js > < / script > < / body > < / html >
