Local_Security_Model / banner 4.html
automajicly's picture
Upload banner 4.html
0b9a55f verified
<!DOCTYPE html>
<!-- saved from url=(0045)file:///Users/chris/Downloads/banner%204.html -->
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { width: 100%; height: 100%; background: #020802; overflow: hidden; }
svg { display: block; width: 100%; height: 100vh; }
</style>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 560" width="100%" height="560" style="display:block;max-height:560px;background:#020802;overflow:hidden;">
<defs>
<filter id="glow">
<fegaussianblur stdDeviation="3" result="coloredBlur"></fegaussianblur>
<femerge><femergenode in="coloredBlur"></femergenode><femergenode in="SourceGraphic"></femergenode></femerge>
</filter>
<filter id="glow-strong">
<fegaussianblur stdDeviation="6" result="coloredBlur"></fegaussianblur>
<femerge><femergenode in="coloredBlur"></femergenode><femergenode in="SourceGraphic"></femergenode></femerge>
</filter>
<filter id="glow-intense">
<fegaussianblur stdDeviation="10" result="coloredBlur"></fegaussianblur>
<femerge><femergenode in="coloredBlur"></femergenode><femergenode in="SourceGraphic"></femergenode></femerge>
</filter>
<filter id="fire-blur">
<feturbulence type="turbulence" baseFrequency="0.02 0.08" numOctaves="3" seed="2" result="noise">
<animate attributeName="seed" values="0;50" dur="0.4s" repeatCount="indefinite"></animate>
</feturbulence>
<fedisplacementmap in="SourceGraphic" in2="noise" scale="6" xChannelSelector="R" yChannelSelector="G"></fedisplacementmap>
<fegaussianblur stdDeviation="1.5"></fegaussianblur>
</filter>
<radialgradient id="bg-grad" cx="50%" cy="50%" r="70%">
<stop offset="0%" stop-color="#0a1a0a"></stop>
<stop offset="100%" stop-color="#020802"></stop>
</radialgradient>
<radialgradient id="hex-glow" cx="50%" cy="50%" r="50%">
<stop offset="0%" stop-color="#00ff41" stop-opacity="0.15"></stop>
<stop offset="100%" stop-color="#00ff41" stop-opacity="0"></stop>
</radialgradient>
<lineargradient id="mercury-body" x1="0" y1="0" x2="1" y2="1">
<stop offset="0%" stop-color="#00ff41"></stop>
<stop offset="40%" stop-color="#00cc33"></stop>
<stop offset="100%" stop-color="#005511"></stop>
</lineargradient>
<lineargradient id="mercury-head" x1="0" y1="0" x2="1" y2="1">
<stop offset="0%" stop-color="#22ff55"></stop>
<stop offset="60%" stop-color="#00ff41"></stop>
<stop offset="100%" stop-color="#003311"></stop>
</lineargradient>
<clippath id="hex-clip">
<polygon points="600,42 648,68 648,120 600,146 552,120 552,68"></polygon>
</clippath>
<pattern id="dots" x="0" y="0" width="40" height="40" patternUnits="userSpaceOnUse">
<circle cx="20" cy="20" r="0.8" fill="#00ff41" opacity="0.12"></circle>
</pattern>
</defs>
<style>
@keyframes robotWalk {
0% { transform: translateY(0px) scale(1); }
25% { transform: translateY(-3px) scale(1.02); }
50% { transform: translateY(-1px) scale(1.03); }
75% { transform: translateY(-4px) scale(1.02); }
100% { transform: translateY(0px) scale(1); }
}
@keyframes robotLean {
0% { transform: rotate(-1deg); }
50% { transform: rotate(1.5deg); }
100% { transform: rotate(-1deg); }
}
@keyframes headBob {
0% { transform: translateY(0px) rotate(-0.5deg); }
33% { transform: translateY(-2px) rotate(1deg); }
66% { transform: translateY(-1px) rotate(-1deg); }
100% { transform: translateY(0px) rotate(-0.5deg); }
}
@keyframes armSwing {
0% { transform: rotate(-8deg); }
50% { transform: rotate(8deg); }
100% { transform: rotate(-8deg); }
}
@keyframes armSwingR {
0% { transform: rotate(8deg); }
50% { transform: rotate(-8deg); }
100% { transform: rotate(8deg); }
}
@keyframes eyeGlow {
0% { opacity: 0.8; }
50% { opacity: 1; filter: drop-shadow(0 0 6px #00ff41); }
100% { opacity: 0.8; }
}
@keyframes fireFlicker1 {
0% { transform: scaleY(1) scaleX(1) translateY(0); opacity: 0.9; }
20% { transform: scaleY(1.3) scaleX(0.85) translateY(-4px); opacity: 1; }
40% { transform: scaleY(0.9) scaleX(1.1) translateY(2px); opacity: 0.7; }
60% { transform: scaleY(1.4) scaleX(0.8) translateY(-6px); opacity: 1; }
80% { transform: scaleY(1.1) scaleX(0.95) translateY(-2px); opacity: 0.85; }
100% { transform: scaleY(1) scaleX(1) translateY(0); opacity: 0.9; }
}
@keyframes fireFlicker2 {
0% { transform: scaleY(1.2) scaleX(0.9) translateY(-3px); opacity: 0.8; }
30% { transform: scaleY(0.8) scaleX(1.2) translateY(2px); opacity: 1; }
60% { transform: scaleY(1.5) scaleX(0.75) translateY(-7px); opacity: 0.9; }
100% { transform: scaleY(1.2) scaleX(0.9) translateY(-3px); opacity: 0.8; }
}
@keyframes fireFlicker3 {
0% { transform: scaleY(0.9) translateY(2px); opacity: 0.6; }
40% { transform: scaleY(1.4) translateY(-5px); opacity: 1; }
70% { transform: scaleY(1.1) translateY(-2px); opacity: 0.75; }
100% { transform: scaleY(0.9) translateY(2px); opacity: 0.6; }
}
@keyframes hexPulse {
0% { opacity: 0.6; }
50% { opacity: 1; }
100% { opacity: 0.6; }
}
@keyframes cuffSwing {
0% { transform: rotate(-5deg); }
50% { transform: rotate(5deg); }
100% { transform: rotate(-5deg); }
}
@keyframes cuffFireL {
0% { transform: scaleY(1) translateX(0); opacity: 0.85; }
33% { transform: scaleY(1.4) translateX(-2px); opacity: 1; }
66% { transform: scaleY(0.8) translateX(2px); opacity: 0.7; }
100% { transform: scaleY(1) translateX(0); opacity: 0.85; }
}
@keyframes cuffFireR {
0% { transform: scaleY(0.9) translateX(0); opacity: 0.75; }
33% { transform: scaleY(1.3) translateX(2px); opacity: 1; }
66% { transform: scaleY(1.1) translateX(-2px); opacity: 0.8; }
100% { transform: scaleY(0.9) translateX(0); opacity: 0.75; }
}
@keyframes mercuryShimmer {
0% { filter: drop-shadow(0 0 4px #00ff41) brightness(1); }
50% { filter: drop-shadow(0 0 12px #00ff41) brightness(1.3); }
100% { filter: drop-shadow(0 0 4px #00ff41) brightness(1); }
}
@keyframes legWalkL {
0% { transform: rotate(-10deg); }
50% { transform: rotate(10deg); }
100% { transform: rotate(-10deg); }
}
@keyframes legWalkR {
0% { transform: rotate(10deg); }
50% { transform: rotate(-10deg); }
100% { transform: rotate(10deg); }
}
.robot-body { animation: robotWalk 1.2s ease-in-out infinite, mercuryShimmer 2s ease-in-out infinite; transform-origin: 600px 120px; }
.robot-torso { animation: robotLean 1.2s ease-in-out infinite; transform-origin: 600px 100px; }
.robot-head { animation: headBob 1.0s ease-in-out infinite; transform-origin: 600px 68px; }
.robot-arm-l { animation: armSwing 1.2s ease-in-out infinite; transform-origin: 582px 95px; }
.robot-arm-r { animation: armSwingR 1.2s ease-in-out infinite; transform-origin: 618px 95px; }
.robot-leg-l { animation: legWalkL 1.2s ease-in-out infinite; transform-origin: 592px 120px; }
.robot-leg-r { animation: legWalkR 1.2s ease-in-out infinite; transform-origin: 608px 120px; }
.robot-eyes { animation: eyeGlow 0.8s ease-in-out infinite; }
.fire-1 { animation: fireFlicker1 0.35s ease-in-out infinite; transform-origin: center bottom; }
.fire-2 { animation: fireFlicker2 0.28s ease-in-out infinite; transform-origin: center bottom; }
.fire-3 { animation: fireFlicker3 0.42s ease-in-out infinite; transform-origin: center bottom; }
.hex-ring { animation: hexPulse 1.5s ease-in-out infinite; }
.cuff-l { animation: cuffSwing 2s ease-in-out infinite; transform-origin: 500px 94px; }
.cuff-r { animation: cuffSwing 2s ease-in-out infinite reverse; transform-origin: 700px 94px; }
.cuff-fire-l { animation: cuffFireL 0.38s ease-in-out infinite; transform-origin: center bottom; }
.cuff-fire-r { animation: cuffFireR 0.31s ease-in-out infinite; transform-origin: center bottom; }
</style>
<!-- Background -->
<rect width="1200" height="400" fill="url(#bg-grad)"></rect>
<rect width="1200" height="400" fill="url(#dots)"></rect>
<!-- Corner brackets -->
<line x1="30" y1="50" x2="30" y2="30" stroke="#00ff41" stroke-width="2.5" filter="url(#glow)"></line>
<line x1="30" y1="30" x2="80" y2="30" stroke="#00ff41" stroke-width="2.5" filter="url(#glow)"></line>
<line x1="1170" y1="50" x2="1170" y2="30" stroke="#00ff41" stroke-width="2.5" filter="url(#glow)"></line>
<line x1="1170" y1="30" x2="1120" y2="30" stroke="#00ff41" stroke-width="2.5" filter="url(#glow)"></line>
<line x1="30" y1="350" x2="30" y2="370" stroke="#00ff41" stroke-width="2.5" filter="url(#glow)"></line>
<line x1="30" y1="370" x2="80" y2="370" stroke="#00ff41" stroke-width="2.5" filter="url(#glow)"></line>
<line x1="1170" y1="350" x2="1170" y2="370" stroke="#00ff41" stroke-width="2.5" filter="url(#glow)"></line>
<line x1="1170" y1="370" x2="1120" y2="370" stroke="#00ff41" stroke-width="2.5" filter="url(#glow)"></line>
<!-- Terminal lines top left -->
<text x="50" y="65" font-family="&#39;Courier New&#39;, monospace" font-size="11" fill="#00ff41" opacity="0.7" filter="url(#glow)">[ SYSTEM INITIALIZED ]</text>
<text x="50" y="83" font-family="&#39;Courier New&#39;, monospace" font-size="10" fill="#00ff41" opacity="0.5">$ agent_loop.py --target 192.168.x.x</text>
<text x="50" y="99" font-family="&#39;Courier New&#39;, monospace" font-size="10" fill="#00ff41" opacity="0.5">▶ masscan: 24 ports discovered</text>
<text x="50" y="115" font-family="&#39;Courier New&#39;, monospace" font-size="10" fill="#00ff41" opacity="0.45">▶ nmap: service enumeration complete</text>
<text x="50" y="131" font-family="&#39;Courier New&#39;, monospace" font-size="10" fill="#00ff41" opacity="0.4">▶ sqlmap: injection vector found</text>
<text x="50" y="147" font-family="&#39;Courier New&#39;, monospace" font-size="10" fill="#00ff41" opacity="0.35">▶ hydra: credential audit running...</text>
<!-- Hex background glow -->
<ellipse cx="600" cy="94" rx="80" ry="80" fill="url(#hex-glow)"></ellipse>
<!-- ===================== LEFT HANDCUFF ===================== -->
<g class="cuff-l">
<!-- Chain links connecting to hex -->
<line x1="552" y1="94" x2="530" y2="94" stroke="#00ff41" stroke-width="2" opacity="0.7" filter="url(#glow)"></line>
<ellipse cx="526" cy="94" rx="6" ry="4" fill="none" stroke="#00ff41" stroke-width="1.8" opacity="0.8" filter="url(#glow)"></ellipse>
<ellipse cx="516" cy="94" rx="6" ry="4" fill="none" stroke="#00ff41" stroke-width="1.8" opacity="0.8" filter="url(#glow)"></ellipse>
<ellipse cx="506" cy="94" rx="6" ry="4" fill="none" stroke="#00ff41" stroke-width="1.8" opacity="0.8" filter="url(#glow)"></ellipse>
<!-- Cuff body -->
<rect x="468" y="82" width="32" height="24" rx="12" fill="none" stroke="#00ff41" stroke-width="2.5" filter="url(#glow-strong)"></rect>
<rect x="472" y="86" width="24" height="16" rx="8" fill="none" stroke="#00ff41" stroke-width="1.2" opacity="0.5"></rect>
<!-- Cuff hinge -->
<rect x="482" y="80" width="8" height="6" rx="2" fill="#00ff41" opacity="0.6" filter="url(#glow)"></rect>
<!-- Cuff lock -->
<rect x="480" y="99" width="12" height="9" rx="2" fill="none" stroke="#00ff41" stroke-width="1.5" filter="url(#glow)"></rect>
<circle cx="486" cy="103" r="2" fill="#00ff41" opacity="0.8"></circle>
<!-- Left cuff fires -->
<g class="cuff-fire-l">
<polygon points="478,82 481,68 484,78 487,63 490,76 493,70 496,82" fill="#00ff41" opacity="0.9" filter="url(#fire-blur)"></polygon>
<polygon points="480,82 483,72 486,66 489,74 492,82" fill="#22ff55" opacity="0.7" filter="url(#glow)"></polygon>
</g>
<g style="animation: cuffFireR 0.45s ease-in-out infinite; transform-origin: center bottom;">
<polygon points="474,82 477,71 480,79 483,65 486,75 489,82" fill="#00ff41" opacity="0.6" filter="url(#fire-blur)"></polygon>
</g>
</g>
<!-- ===================== RIGHT HANDCUFF ===================== -->
<g class="cuff-r">
<!-- Chain links -->
<line x1="648" y1="94" x2="670" y2="94" stroke="#00ff41" stroke-width="2" opacity="0.7" filter="url(#glow)"></line>
<ellipse cx="674" cy="94" rx="6" ry="4" fill="none" stroke="#00ff41" stroke-width="1.8" opacity="0.8" filter="url(#glow)"></ellipse>
<ellipse cx="684" cy="94" rx="6" ry="4" fill="none" stroke="#00ff41" stroke-width="1.8" opacity="0.8" filter="url(#glow)"></ellipse>
<ellipse cx="694" cy="94" rx="6" ry="4" fill="none" stroke="#00ff41" stroke-width="1.8" opacity="0.8" filter="url(#glow)"></ellipse>
<!-- Cuff body -->
<rect x="700" y="82" width="32" height="24" rx="12" fill="none" stroke="#00ff41" stroke-width="2.5" filter="url(#glow-strong)"></rect>
<rect x="704" y="86" width="24" height="16" rx="8" fill="none" stroke="#00ff41" stroke-width="1.2" opacity="0.5"></rect>
<!-- Cuff hinge -->
<rect x="710" y="80" width="8" height="6" rx="2" fill="#00ff41" opacity="0.6" filter="url(#glow)"></rect>
<!-- Cuff lock -->
<rect x="708" y="99" width="12" height="9" rx="2" fill="none" stroke="#00ff41" stroke-width="1.5" filter="url(#glow)"></rect>
<circle cx="714" cy="103" r="2" fill="#00ff41" opacity="0.8"></circle>
<!-- Right cuff fires -->
<g class="cuff-fire-r">
<polygon points="704,82 707,67 710,77 713,62 716,75 719,69 722,82" fill="#00ff41" opacity="0.9" filter="url(#fire-blur)"></polygon>
<polygon points="706,82 709,71 712,65 715,73 718,82" fill="#22ff55" opacity="0.7" filter="url(#glow)"></polygon>
</g>
<g class="cuff-fire-l">
<polygon points="702,82 705,70 708,78 711,64 714,74 717,82" fill="#00ff41" opacity="0.6" filter="url(#fire-blur)"></polygon>
</g>
</g>
<!-- ===================== HEXAGON ===================== -->
<!-- Outer hex rings -->
<polygon class="hex-ring" points="600,38 652,67 652,125 600,154 548,125 548,67" fill="none" stroke="#00ff41" stroke-width="1" opacity="0.3"></polygon>
<polygon class="hex-ring" points="600,42 648,70 648,120 600,148 552,120 552,70" fill="none" stroke="#00ff41" stroke-width="2" opacity="0.6" filter="url(#glow)" style="animation-delay:0.3s"></polygon>
<polygon points="600,46 644,72 644,118 600,144 556,118 556,72" fill="#030f03" stroke="#00ff41" stroke-width="1" opacity="0.4"></polygon>
<!-- Hex inner glow -->
<polygon points="600,46 644,72 644,118 600,144 556,118 556,72" fill="url(#hex-glow)" clip-path="url(#hex-clip)"></polygon>
<!-- ===================== FIRE INSIDE HEX ===================== -->
<g clip-path="url(#hex-clip)">
<!-- Base fire layer -->
<g class="fire-1">
<polygon points="575,144 582,118 588,130 594,108 600,125 606,105 612,122 618,112 624,130 630,115 636,144" fill="#00ff41" opacity="0.85" filter="url(#fire-blur)"></polygon>
</g>
<g class="fire-2">
<polygon points="570,144 578,120 585,133 591,110 597,128 603,103 609,120 615,108 622,126 629,116 638,144" fill="#00dd33" opacity="0.7" filter="url(#fire-blur)"></polygon>
</g>
<g class="fire-3">
<polygon points="580,144 586,122 592,135 598,112 604,130 610,115 616,128 622,118 628,135 634,144" fill="#22ff55" opacity="0.5" filter="url(#glow)"></polygon>
</g>
<!-- Inner bright fire core -->
<g style="animation: fireFlicker1 0.22s ease-in-out infinite; transform-origin: 600px 144px;">
<polygon points="588,144 593,126 598,136 602,118 606,132 611,144" fill="#88ffaa" opacity="0.6" filter="url(#glow-strong)"></polygon>
</g>
</g>
<!-- ===================== ROBOT (clipped inside hex) ===================== -->
<g clip-path="url(#hex-clip)">
<g class="robot-body">
<g class="robot-torso">
<!-- LEFT ARM -->
<g class="robot-arm-l">
<!-- upper arm -->
<rect x="574" y="88" width="8" height="20" rx="3" fill="url(#mercury-body)" filter="url(#glow)"></rect>
<!-- forearm -->
<rect x="572" y="106" width="7" height="16" rx="3" fill="url(#mercury-body)" opacity="0.85" filter="url(#glow)" transform="rotate(-5,575,106)"></rect>
<!-- hand/claw -->
<polygon points="570,121 574,118 576,123 572,126" fill="#00ff41" filter="url(#glow)"></polygon>
<polygon points="574,122 578,119 579,124 575,127" fill="#00ff41" filter="url(#glow)"></polygon>
</g>
<!-- RIGHT ARM -->
<g class="robot-arm-r">
<rect x="618" y="88" width="8" height="20" rx="3" fill="url(#mercury-body)" filter="url(#glow)"></rect>
<rect x="621" y="106" width="7" height="16" rx="3" fill="url(#mercury-body)" opacity="0.85" filter="url(#glow)" transform="rotate(5,625,106)"></rect>
<polygon points="624,121 628,118 630,123 626,126" fill="#00ff41" filter="url(#glow)"></polygon>
<polygon points="620,122 624,119 625,124 621,127" fill="#00ff41" filter="url(#glow)"></polygon>
</g>
<!-- TORSO -->
<!-- Main torso -->
<rect x="584" y="86" width="32" height="36" rx="4" fill="url(#mercury-body)" filter="url(#glow-strong)"></rect>
<!-- Torso detail lines (liquid mercury seams) -->
<line x1="590" y1="90" x2="610" y2="90" stroke="#88ffaa" stroke-width="0.8" opacity="0.6"></line>
<line x1="588" y1="96" x2="612" y2="96" stroke="#88ffaa" stroke-width="0.5" opacity="0.4"></line>
<line x1="586" y1="108" x2="614" y2="108" stroke="#88ffaa" stroke-width="0.5" opacity="0.4"></line>
<!-- Chest core reactor -->
<circle cx="600" cy="100" r="5" fill="#001100" stroke="#00ff41" stroke-width="1.5" filter="url(#glow)"></circle>
<circle cx="600" cy="100" r="2.5" fill="#00ff41" opacity="0.9" filter="url(#glow-strong)">
<animate attributeName="r" values="2;3.5;2" dur="0.6s" repeatCount="indefinite"></animate>
<animate attributeName="opacity" values="0.7;1;0.7" dur="0.6s" repeatCount="indefinite"></animate>
</circle>
<!-- Shoulder pads -->
<rect x="581" y="84" width="10" height="7" rx="3" fill="url(#mercury-body)" filter="url(#glow)"></rect>
<rect x="609" y="84" width="10" height="7" rx="3" fill="url(#mercury-body)" filter="url(#glow)"></rect>
<!-- NECK -->
<rect x="596" y="80" width="8" height="8" rx="2" fill="url(#mercury-body)" filter="url(#glow)"></rect>
<!-- HEAD -->
<g class="robot-head">
<!-- Head shape - slightly angular/terminator -->
<rect x="586" y="57" width="28" height="24" rx="4" fill="url(#mercury-head)" filter="url(#glow-strong)"></rect>
<!-- Head side panels -->
<rect x="583" y="61" width="5" height="14" rx="2" fill="url(#mercury-body)" opacity="0.8" filter="url(#glow)"></rect>
<rect x="612" y="61" width="5" height="14" rx="2" fill="url(#mercury-body)" opacity="0.8" filter="url(#glow)"></rect>
<!-- EYES - glowing red terminator style but green -->
<g class="robot-eyes">
<ellipse cx="594" cy="67" rx="4" ry="3" fill="#001100" stroke="#00ff41" stroke-width="1" filter="url(#glow)"></ellipse>
<ellipse cx="594" cy="67" rx="2.5" ry="2" fill="#00ff41" filter="url(#glow-intense)"></ellipse>
<ellipse cx="606" cy="67" rx="4" ry="3" fill="#001100" stroke="#00ff41" stroke-width="1" filter="url(#glow)"></ellipse>
<ellipse cx="606" cy="67" rx="2.5" ry="2" fill="#00ff41" filter="url(#glow-intense)"></ellipse>
<!-- Eye scan line -->
<line x1="590" y1="67" x2="610" y2="67" stroke="#00ff41" stroke-width="0.5" opacity="0.4">
<animate attributeName="opacity" values="0;0.6;0" dur="1.2s" repeatCount="indefinite"></animate>
</line>
</g>
<!-- Mouth/jaw slot -->
<rect x="592" y="75" width="16" height="3" rx="1" fill="#001100" stroke="#00ff41" stroke-width="0.8" opacity="0.8"></rect>
<!-- Jaw teeth detail -->
<line x1="595" y1="75" x2="595" y2="78" stroke="#00ff41" stroke-width="0.8" opacity="0.5"></line>
<line x1="599" y1="75" x2="599" y2="78" stroke="#00ff41" stroke-width="0.8" opacity="0.5"></line>
<line x1="603" y1="75" x2="603" y2="78" stroke="#00ff41" stroke-width="0.8" opacity="0.5"></line>
<!-- Head top detail -->
<rect x="594" y="55" width="12" height="4" rx="1" fill="url(#mercury-body)" opacity="0.7"></rect>
<line x1="598" y1="53" x2="598" y2="57" stroke="#00ff41" stroke-width="1.5" opacity="0.6" filter="url(#glow)"></line>
<line x1="602" y1="53" x2="602" y2="57" stroke="#00ff41" stroke-width="1.5" opacity="0.6" filter="url(#glow)"></line>
</g>
<!-- HIPS -->
<rect x="586" y="120" width="28" height="8" rx="3" fill="url(#mercury-body)" filter="url(#glow)"></rect>
<!-- LEGS -->
<g class="robot-leg-l">
<rect x="586" y="126" width="11" height="18" rx="3" fill="url(#mercury-body)" filter="url(#glow)"></rect>
<!-- knee joint -->
<circle cx="591" cy="143" r="3.5" fill="#001100" stroke="#00ff41" stroke-width="1.2" filter="url(#glow)"></circle>
<!-- shin -->
<rect x="587" y="144" width="9" height="12" rx="2" fill="url(#mercury-body)" opacity="0.85" filter="url(#glow)"></rect>
<!-- foot -->
<rect x="584" y="154" width="14" height="5" rx="2" fill="url(#mercury-body)" filter="url(#glow)"></rect>
</g>
<g class="robot-leg-r">
<rect x="603" y="126" width="11" height="18" rx="3" fill="url(#mercury-body)" filter="url(#glow)"></rect>
<circle cx="609" cy="143" r="3.5" fill="#001100" stroke="#00ff41" stroke-width="1.2" filter="url(#glow)"></circle>
<rect x="604" y="144" width="9" height="12" rx="2" fill="url(#mercury-body)" opacity="0.85" filter="url(#glow)"></rect>
<rect x="602" y="154" width="14" height="5" rx="2" fill="url(#mercury-body)" filter="url(#glow)"></rect>
</g>
</g>
</g>
</g>
<!-- Hex border on top of everything inside -->
<polygon points="600,42 648,70 648,120 600,148 552,120 552,70" fill="none" stroke="#00ff41" stroke-width="2.5" filter="url(#glow-strong)" class="hex-ring"></polygon>
<!-- ===================== MAIN TEXT ===================== -->
<text x="600" y="240" font-family="&#39;Courier New&#39;, monospace" font-size="72" font-weight="bold" fill="#00ff41" text-anchor="middle" letter-spacing="12" filter="url(#glow-strong)">LOCAL SECURITY</text>
<text x="600" y="278" font-family="&#39;Courier New&#39;, monospace" font-size="20" fill="#00ff41" text-anchor="middle" letter-spacing="8" opacity="0.85" filter="url(#glow)">AUTONOMOUS AGENT</text>
<line x1="200" y1="296" x2="1000" y2="296" stroke="#00ff41" stroke-width="0.8" opacity="0.3"></line>
<text x="600" y="320" font-family="&#39;Courier New&#39;, monospace" font-size="13" fill="#00ff41" text-anchor="middle" letter-spacing="4" opacity="0.6" filter="url(#glow)">QWEN 2.5 · MCP ARCHITECTURE · KALI LINUX</text>
<!-- Status bar -->
<text x="50" y="335" font-family="&#39;Courier New&#39;, monospace" font-size="11" fill="#00ff41" opacity="0.7" filter="url(#glow)">STATUS: ACTIVE</text>
<text x="1150" y="335" font-family="&#39;Courier New&#39;, monospace" font-size="11" fill="#00ff41" text-anchor="end" opacity="0.6">automajicly @ huggingface.co</text>
<text x="1150" y="320" font-family="&#39;Courier New&#39;, monospace" font-size="10" fill="#00ff41" text-anchor="end" opacity="0.4">MIT LICENSE</text>
<style>
@keyframes hackerBob { 0%{transform:translateY(0)} 50%{transform:translateY(-3px)} 100%{transform:translateY(0)} }
@keyframes hackerLean { 0%{transform:rotate(-1deg)} 50%{transform:rotate(1deg)} 100%{transform:rotate(-1deg)} }
@keyframes armTypeL { 0%{transform:rotate(-8deg) translateY(0)} 25%{transform:rotate(-4deg) translateY(-2px)} 50%{transform:rotate(-9deg) translateY(1px)} 75%{transform:rotate(-3deg) translateY(-3px)} 100%{transform:rotate(-8deg) translateY(0)} }
@keyframes armTypeR { 0%{transform:rotate(8deg) translateY(1px)} 25%{transform:rotate(4deg) translateY(-2px)} 50%{transform:rotate(10deg) translateY(0)} 75%{transform:rotate(3deg) translateY(-3px)} 100%{transform:rotate(8deg) translateY(1px)} }
@keyframes fingerFire1 { 0%{transform:scaleY(1) translateY(0);opacity:0.9} 30%{transform:scaleY(1.6) translateY(-5px);opacity:1} 60%{transform:scaleY(0.8) translateY(2px);opacity:0.7} 100%{transform:scaleY(1) translateY(0);opacity:0.9} }
@keyframes fingerFire2 { 0%{transform:scaleY(1.3) translateY(-3px);opacity:0.8} 40%{transform:scaleY(0.7) translateY(3px);opacity:1} 70%{transform:scaleY(1.5) translateY(-6px);opacity:0.85} 100%{transform:scaleY(1.3) translateY(-3px);opacity:0.8} }
@keyframes keyPress { 0%{transform:translateY(0)} 10%{transform:translateY(2px)} 20%{transform:translateY(0)} 35%{transform:translateY(1px)} 45%{transform:translateY(0)} 60%{transform:translateY(2px)} 70%{transform:translateY(0)} 100%{transform:translateY(0)} }
@keyframes eyeScan { 0%{transform:translateX(0)} 25%{transform:translateX(2px)} 50%{transform:translateX(-2px)} 75%{transform:translateX(1px)} 100%{transform:translateX(0)} }
@keyframes screenFlicker { 0%{opacity:0.8} 5%{opacity:1} 10%{opacity:0.85} 50%{opacity:0.95} 55%{opacity:0.7} 60%{opacity:1} 100%{opacity:0.8} }
@keyframes codeScroll { 0%{transform:translateY(0)} 100%{transform:translateY(-40px)} }
@keyframes warningPulse { 0%{opacity:0.7;} 50%{opacity:1;} 100%{opacity:0.7;} }
.hacker-body { animation: hackerBob 1s ease-in-out infinite; transform-origin: 600px 390px; }
.hacker-torso { animation: hackerLean 1s ease-in-out infinite; transform-origin: 600px 375px; }
.hacker-arm-l { animation: armTypeL 0.4s ease-in-out infinite; transform-origin: 582px 370px; }
.hacker-arm-r { animation: armTypeR 0.4s ease-in-out infinite; transform-origin: 618px 370px; }
.hacker-eyes { animation: eyeScan 0.5s ease-in-out infinite; }
.ffire-1 { animation: fingerFire1 0.2s ease-in-out infinite; transform-origin: center bottom; }
.ffire-2 { animation: fingerFire2 0.17s ease-in-out infinite; transform-origin: center bottom; }
.key-press { animation: keyPress 0.4s ease-in-out infinite; }
.screen-flicker { animation: screenFlicker 2s ease-in-out infinite; }
.code-scroll { animation: codeScroll 3s linear infinite; }
.warn-pulse { animation: warningPulse 1.5s ease-in-out infinite; }
</style>
<!-- ===================== BOTTOM HACKER SCENE ===================== -->
<!-- Desk surface -->
<rect x="0" y="545" width="1200" height="20" fill="#001a00" opacity="0.8"></rect>
<line x1="0" y1="545" x2="1200" y2="545" stroke="#00ff41" stroke-width="0.8" opacity="0.4" filter="url(#glow)"></line>
<!-- Warning text left and right -->
<text class="warn-pulse" x="50" y="538" font-family="&#39;Courier New&#39;, monospace" font-size="13" fill="#39ff14" opacity="0.7" letter-spacing="3">⚠ UNAUTHORIZED ACCESS WILL BE PROSECUTED ⚠</text>
<text class="warn-pulse" x="700" y="538" font-family="&#39;Courier New&#39;, monospace" font-size="13" fill="#39ff14" opacity="0.7" letter-spacing="3" style="animation-delay:0.75s">⚠ UNAUTHORIZED ACCESS WILL BE PROSECUTED ⚠</text>
<!-- ===== ROBOT HACKER CENTERED — scaled up 2.8x, shifted down into black ===== -->
<g transform="translate(600,490) scale(2.8) translate(-600,-390)">
<g class="hacker-body">
<g class="hacker-torso">
<!-- KEYBOARD -->
<g class="key-press">
<rect x="548" y="383" width="104" height="14" rx="3" fill="#001500" stroke="#00ff41" stroke-width="1.2" filter="url(#glow)"></rect>
<!-- Key rows -->
<rect x="552" y="385" width="8" height="4" rx="1" fill="#00ff41" opacity="0.5"></rect>
<rect x="562" y="385" width="8" height="4" rx="1" fill="#00ff41" opacity="0.5"></rect>
<rect x="572" y="385" width="8" height="4" rx="1" fill="#00ff41" opacity="0.5"></rect>
<rect x="582" y="385" width="8" height="4" rx="1" fill="#00ff41" opacity="0.5"></rect>
<rect x="592" y="385" width="8" height="4" rx="1" fill="#00ff41" opacity="0.5"></rect>
<rect x="602" y="385" width="8" height="4" rx="1" fill="#00ff41" opacity="0.5"></rect>
<rect x="612" y="385" width="8" height="4" rx="1" fill="#00ff41" opacity="0.5"></rect>
<rect x="622" y="385" width="8" height="4" rx="1" fill="#00ff41" opacity="0.5"></rect>
<rect x="632" y="385" width="8" height="4" rx="1" fill="#00ff41" opacity="0.5"></rect>
<rect x="554" y="391" width="12" height="4" rx="1" fill="#00ff41" opacity="0.4"></rect>
<rect x="568" y="391" width="8" height="4" rx="1" fill="#00ff41" opacity="0.4"></rect>
<rect x="578" y="391" width="8" height="4" rx="1" fill="#00ff41" opacity="0.4"></rect>
<rect x="588" y="391" width="18" height="4" rx="1" fill="#00ff41" opacity="0.6"></rect>
<rect x="608" y="391" width="8" height="4" rx="1" fill="#00ff41" opacity="0.4"></rect>
<rect x="618" y="391" width="8" height="4" rx="1" fill="#00ff41" opacity="0.4"></rect>
<rect x="628" y="391" width="12" height="4" rx="1" fill="#00ff41" opacity="0.4"></rect>
</g>
<!-- MONITOR screen (small, to left of robot) -->
<rect x="490" y="348" width="52" height="38" rx="3" fill="#000d00" stroke="#00ff41" stroke-width="1.5" filter="url(#glow)"></rect>
<rect x="493" y="351" width="46" height="30" rx="2" fill="#000a00" class="screen-flicker"></rect>
<!-- Code scrolling on screen -->
<clippath id="screen-clip"><rect x="493" y="351" width="46" height="30" rx="2"></rect></clippath>
<g clip-path="url(#screen-clip)" class="code-scroll">
<text x="495" y="358" font-family="&#39;Courier New&#39;, monospace" font-size="4" fill="#00ff41" opacity="0.9">masscan -p1-65535</text>
<text x="495" y="363" font-family="&#39;Courier New&#39;, monospace" font-size="4" fill="#00ff41" opacity="0.8">nmap -sV -O target</text>
<text x="495" y="368" font-family="&#39;Courier New&#39;, monospace" font-size="4" fill="#ff6600" opacity="0.9">EXPLOIT FOUND!</text>
<text x="495" y="373" font-family="&#39;Courier New&#39;, monospace" font-size="4" fill="#00ff41" opacity="0.7">sqlmap --dbs</text>
<text x="495" y="378" font-family="&#39;Courier New&#39;, monospace" font-size="4" fill="#00ff41" opacity="0.8">hydra -l admin</text>
<text x="495" y="383" font-family="&#39;Courier New&#39;, monospace" font-size="4" fill="#39ff14" opacity="0.9">ACCESS GRANTED</text>
<text x="495" y="388" font-family="&#39;Courier New&#39;, monospace" font-size="4" fill="#00ff41" opacity="0.7">searchsploit vsftpd</text>
<text x="495" y="393" font-family="&#39;Courier New&#39;, monospace" font-size="4" fill="#00ff41" opacity="0.8">msfconsole -x</text>
</g>
<!-- Monitor stand -->
<rect x="513" y="386" width="6" height="6" rx="1" fill="#00ff41" opacity="0.5"></rect>
<rect x="507" y="391" width="18" height="3" rx="1" fill="#00ff41" opacity="0.4"></rect>
<!-- LEFT ARM (typing) -->
<g class="hacker-arm-l">
<!-- upper arm -->
<rect x="572" y="358" width="9" height="18" rx="3" fill="url(#mercury-body)" filter="url(#glow)"></rect>
<!-- forearm angled toward keyboard -->
<rect x="568" y="373" width="8" height="14" rx="3" fill="url(#mercury-body)" opacity="0.9" filter="url(#glow)" transform="rotate(15,572,373)"></rect>
<!-- Hand -->
<ellipse cx="569" cy="385" rx="6" ry="4" fill="url(#mercury-body)" filter="url(#glow-strong)"></ellipse>
<!-- Finger fire LEFT HAND -->
<g class="ffire-1">
<polygon points="564,383 566,373 568,379 570,370 572,377 574,383" fill="#ff6600" opacity="0.95" filter="url(#fire-blur)"></polygon>
<polygon points="565,383 567,375 569,372 571,378 573,383" fill="#ff4400" opacity="0.7"></polygon>
<polygon points="566,383 568,377 570,374 572,380 574,383" fill="#ffaa00" opacity="0.5" filter="url(#glow)"></polygon>
</g>
<g class="ffire-2">
<polygon points="562,383 564,376 566,371 568,378 570,383" fill="#ff6600" opacity="0.6" filter="url(#fire-blur)"></polygon>
<polygon points="572,383 574,374 576,369 578,376 580,383" fill="#ff4400" opacity="0.5" filter="url(#fire-blur)"></polygon>
</g>
<!-- Orange glow under fingers -->
<ellipse cx="569" cy="383" rx="8" ry="3" fill="#ff6600" opacity="0.25" filter="url(#glow-strong)"></ellipse>
</g>
<!-- RIGHT ARM (typing) -->
<g class="hacker-arm-r">
<!-- upper arm -->
<rect x="619" y="358" width="9" height="18" rx="3" fill="url(#mercury-body)" filter="url(#glow)"></rect>
<!-- forearm -->
<rect x="622" y="373" width="8" height="14" rx="3" fill="url(#mercury-body)" opacity="0.9" filter="url(#glow)" transform="rotate(-15,626,373)"></rect>
<!-- Hand -->
<ellipse cx="630" cy="385" rx="6" ry="4" fill="url(#mercury-body)" filter="url(#glow-strong)"></ellipse>
<!-- Finger fire RIGHT HAND -->
<g class="ffire-2">
<polygon points="625,383 627,372 629,378 631,369 633,376 635,383" fill="#ff6600" opacity="0.95" filter="url(#fire-blur)"></polygon>
<polygon points="626,383 628,374 630,371 632,377 634,383" fill="#ff4400" opacity="0.7"></polygon>
<polygon points="627,383 629,376 631,373 633,379 635,383" fill="#ffaa00" opacity="0.5" filter="url(#glow)"></polygon>
</g>
<g class="ffire-1">
<polygon points="623,383 625,375 627,370 629,377 631,383" fill="#ff6600" opacity="0.6" filter="url(#fire-blur)"></polygon>
<polygon points="633,383 635,373 637,368 639,375 641,383" fill="#ff4400" opacity="0.5" filter="url(#fire-blur)"></polygon>
</g>
<ellipse cx="630" cy="383" rx="8" ry="3" fill="#ff6600" opacity="0.25" filter="url(#glow-strong)"></ellipse>
</g>
<!-- TORSO (hunched forward slightly) -->
<rect x="585" y="355" width="30" height="28" rx="4" fill="url(#mercury-body)" filter="url(#glow-strong)" transform="rotate(5,600,369)"></rect>
<!-- Chest reactor -->
<circle cx="600" cy="365" r="4" fill="#001100" stroke="#00ff41" stroke-width="1.2" filter="url(#glow)"></circle>
<circle cx="600" cy="365" r="2" fill="#00ff41" filter="url(#glow-intense)">
<animate attributeName="r" values="1.5;3;1.5" dur="0.5s" repeatCount="indefinite"></animate>
<animate attributeName="opacity" values="0.7;1;0.7" dur="0.5s" repeatCount="indefinite"></animate>
</circle>
<!-- Shoulder pads -->
<rect x="582" y="353" width="9" height="6" rx="2" fill="url(#mercury-body)" filter="url(#glow)"></rect>
<rect x="609" y="353" width="9" height="6" rx="2" fill="url(#mercury-body)" filter="url(#glow)"></rect>
<!-- NECK -->
<rect x="596" y="349" width="8" height="7" rx="2" fill="url(#mercury-body)" filter="url(#glow)"></rect>
<!-- HEAD (tilted slightly forward/down like concentrating) -->
<g transform="rotate(8,600,355)">
<!-- Head -->
<rect x="587" y="330" width="26" height="22" rx="4" fill="url(#mercury-head)" filter="url(#glow-strong)"></rect>
<!-- Side panels -->
<rect x="584" y="334" width="5" height="12" rx="2" fill="url(#mercury-body)" opacity="0.8" filter="url(#glow)"></rect>
<rect x="611" y="334" width="5" height="12" rx="2" fill="url(#mercury-body)" opacity="0.8" filter="url(#glow)"></rect>
<!-- EYES - scanning the screen intently -->
<g class="hacker-eyes">
<ellipse cx="595" cy="339" rx="3.5" ry="2.5" fill="#001100" stroke="#00ff41" stroke-width="1" filter="url(#glow)"></ellipse>
<ellipse cx="595" cy="339" rx="2" ry="1.8" fill="#00ff41" filter="url(#glow-intense)"></ellipse>
<ellipse cx="605" cy="339" rx="3.5" ry="2.5" fill="#001100" stroke="#00ff41" stroke-width="1" filter="url(#glow)"></ellipse>
<ellipse cx="605" cy="339" rx="2" ry="1.8" fill="#00ff41" filter="url(#glow-intense)"></ellipse>
<!-- Eye scan beam toward monitor -->
<line x1="585" y1="339" x2="492" y2="362" stroke="#00ff41" stroke-width="0.6" opacity="0.2">
<animate attributeName="opacity" values="0;0.4;0" dur="0.8s" repeatCount="indefinite"></animate>
</line>
</g>
<!-- Mouth -->
<rect x="593" y="347" width="14" height="2.5" rx="1" fill="#001100" stroke="#00ff41" stroke-width="0.7" opacity="0.8"></rect>
<!-- Head top antenna -->
<line x1="600" y1="328" x2="600" y2="322" stroke="#00ff41" stroke-width="1.5" filter="url(#glow)"></line>
<circle cx="600" cy="321" r="2" fill="#00ff41" filter="url(#glow-strong)">
<animate attributeName="opacity" values="0.4;1;0.4" dur="0.6s" repeatCount="indefinite"></animate>
</circle>
</g>
</g>
</g>
<!-- Floor glow under keyboard -->
<ellipse cx="600" cy="396" rx="70" ry="6" fill="#00ff41" opacity="0.08" filter="url(#glow)"></ellipse>
<ellipse cx="600" cy="396" rx="40" ry="3" fill="#ff6600" opacity="0.12" filter="url(#glow-strong)"></ellipse>
</g><!-- end scale transform -->
<!-- Big floor glow -->
<ellipse cx="600" cy="548" rx="180" ry="10" fill="#00ff41" opacity="0.07" filter="url(#glow)"></ellipse>
<ellipse cx="600" cy="548" rx="100" ry="5" fill="#ff6600" opacity="0.1" filter="url(#glow-strong)"></ellipse>
</svg>
</body></html>