feat: full-height library side panels with animated robots

ui/index.html

@@ -217,58 +217,125 @@
     .prof-arm.right { right: -12px; transform: rotate(-14deg); }
     .professor:hover .prof-arm.right { animation: prof-wave .8s ease-in-out infinite; }
 
-    /* ── Library side panels ──────────────────────────────────────────────── */
+    /* ── Library wings — full-height public-library decor on both edges ──── */
     .library {
-      position: absolute; top: 12px; z-index: 0;
-      width: 180px; height: 380px;
-      border-radius: var(--r);
-      border: 1px solid var(--border);
+      position: fixed; top: 0; bottom: 0; z-index: 0;
+      width: clamp(190px, calc((100vw - 850px) / 2), 340px);
+      display: flex; flex-direction: column; justify-content: space-between;
+      gap: 12px; padding: 26px 18px 0;
       background:
-        radial-gradient(ellipse 90% 30% at 50% -6%, rgba(167,139,250,.10), transparent 60%),
-        linear-gradient(180deg, #0B1126 0%, #0A0F1E 60%, #0C1226 100%);
-      box-shadow: 0 8px 32px rgba(0,0,0,.45), 0 1px 0 rgba(255,255,255,.04) inset;
+        radial-gradient(ellipse 90% 16% at 50% -3%, rgba(167,139,250,.10), transparent 60%),
+        linear-gradient(180deg, #0B1126 0%, #0A0F1E 55%, #0C1226 100%);
       overflow: hidden;
       animation: fadeIn .8s .35s ease both;
     }
-    .library-left  { left: -196px; }
-    .library-right { right: -196px; }
+    .library-left  { left: 0;  border-right: 1px solid var(--border); box-shadow: 18px 0 40px -20px rgba(0,0,0,.6); }
+    .library-right { right: 0; border-left: 1px solid var(--border); box-shadow: -18px 0 40px -20px rgba(0,0,0,.6); }
+    @media (max-width: 1240px) { .library { display: none; } }
 
     /* bookshelf rows — books bottom-align on a wood plank */
     .lib-shelf {
-      position: absolute; left: 14px; right: 14px; height: 64px;
-      display: flex; align-items: flex-end; gap: 3px; padding: 0 6px;
-      border-bottom: 6px solid #3B2D23;
-      box-shadow: 0 8px 10px -6px rgba(0,0,0,.6);
+      position: relative; height: 76px; flex-shrink: 0;
+      display: flex; align-items: flex-end; gap: 4px; padding: 0 8px;
+      border-bottom: 7px solid #3B2D23;
+      box-shadow: 0 9px 12px -7px rgba(0,0,0,.6);
     }
-    .lib-shelf:nth-of-type(1) { top: 26px; }
-    .lib-shelf:nth-of-type(2) { top: 118px; }
-    .lib-shelf:nth-of-type(3) { top: 210px; }
 
     .bk {
       display: block; flex-shrink: 0;
-      width: 10px; height: var(--h, 36px);
+      width: 12px; height: var(--h, 40px);
       background: var(--c, #4C3D8F);
       border-radius: 2px 2px 0 0;
       box-shadow: inset -2px 0 0 rgba(0,0,0,.35), inset 0 2px 0 rgba(255,255,255,.18);
     }
+    .bk.slim { width: 9px; }
+    .bk.wide { width: 16px; }
     .bk.lean {
       transform: rotate(-9deg);
       transform-origin: bottom right;
       margin-left: -2px;
     }
+    .b1 { --c: #7C3AED; } .b2 { --c: #A78BFA; } .b3 { --c: #06B6D4; } .b4 { --c: #67E8F9; }
+    .b5 { --c: #E2E8F0; } .b6 { --c: #4C3D8F; } .b7 { --c: #1E6F8F; } .b8 { --c: #2E2553; }
+
+    /* aisle — perspective corridor between two shelf walls */
+    .lib-aisle {
+      position: relative; flex: 0 1 150px; min-height: 96px;
+      border-radius: 10px; border: 1px solid var(--border);
+      background: linear-gradient(180deg, #0A0F1E, #10172E);
+      overflow: hidden;
+    }
+    .lib-aisle::before, .lib-aisle::after {
+      content: ''; position: absolute; top: 0; bottom: 0; width: 50%;
+      background:
+        repeating-linear-gradient(0deg, rgba(59,45,35,.95) 0 5px, transparent 5px 26px),
+        repeating-linear-gradient(90deg,
+          #4C3D8F 0 6px, #06B6D4 6px 10px, #2E2553 10px 17px,
+          #A78BFA 17px 21px, #1E2240 21px 30px);
+    }
+    .lib-aisle::before { left: 0;  transform: perspective(240px) rotateY(50deg);  transform-origin: left center; }
+    .lib-aisle::after  { right: 0; transform: perspective(240px) rotateY(-50deg); transform-origin: right center; }
+    .aisle-end { /* glowing far end + floor */
+      position: absolute; inset: 0; pointer-events: none;
+      background:
+        radial-gradient(ellipse 26% 40% at 50% 46%, rgba(167,139,250,.30), transparent 70%),
+        linear-gradient(180deg, transparent 58%, rgba(20,26,51,.9) 60%, #141A33 100%);
+    }
+    .aisle-bot { /* tiny robot deep in the corridor */
+      position: absolute; bottom: 26%; left: 50%; margin-left: -6px;
+      width: 12px; height: 17px; border-radius: 4px 4px 3px 3px;
+      background: linear-gradient(180deg, #262C4F 0 45%, #173A52 45% 100%);
+      border: 1px solid rgba(167,139,250,.4);
+      animation: aisle-walk 9s ease-in-out infinite;
+    }
+    .aisle-bot::before { /* visor */
+      content: ''; position: absolute; top: 4px; left: 2px; right: 2px; height: 3px;
+      border-radius: 2px; background: rgba(234,242,255,.85);
+    }
+
+    /* tall section — shelf with room below for ladder / fetching robot */
+    .lib-tall { position: relative; flex: 0 1 200px; min-height: 150px; }
+    .lib-tall .lib-shelf { position: absolute; top: 0; left: 0; right: 0; }
 
-    /* ladder leaning against the shelves (left panel) */
     .lib-ladder {
-      position: absolute; bottom: 8px; right: 16px;
-      width: 32px; height: 122px;
-      transform: rotate(9deg); transform-origin: bottom center;
+      position: absolute; bottom: 4px; right: 24px;
+      width: 32px; height: 126px;
+      transform: rotate(7deg); transform-origin: bottom center;
       border-left: 4px solid #4A372A; border-right: 4px solid #4A372A;
       background: repeating-linear-gradient(180deg, transparent 0 15px, #4A372A 15px 19px);
       border-radius: 3px; opacity: .9;
     }
 
-    /* potted plant on the middle shelf (right panel — sleeper owns the top one) */
-    .lib-plant { position: absolute; top: 142px; right: 24px; width: 20px; height: 34px; }
+    /* study desk — robot working behind it */
+    .lib-desk { position: relative; height: 92px; flex-shrink: 0; }
+    .desk-table { position: absolute; bottom: 6px; left: 14%; right: 14%; height: 36px; }
+    .desk-table::before { /* wood top */
+      content: ''; position: absolute; top: 0; left: 0; right: 0; height: 7px;
+      background: linear-gradient(180deg, #4A372A, #33261D);
+      border-radius: 3px;
+      box-shadow: 0 3px 6px rgba(0,0,0,.45);
+    }
+    .desk-table::after { /* front panel */
+      content: ''; position: absolute; top: 7px; left: 7px; right: 7px; bottom: 0;
+      background: linear-gradient(180deg, #2A2019, #1C1612);
+      border-radius: 0 0 4px 4px;
+    }
+    .desk-screen {
+      position: absolute; bottom: 48px; left: 58%;
+      width: 17px; height: 12px; transform: skewX(-6deg);
+      background: linear-gradient(180deg, #67E8F9, #0E7490);
+      border-radius: 2px 2px 1px 1px;
+      box-shadow: 0 0 10px rgba(103,232,249,.55);
+      animation: pulse 1.7s ease-in-out infinite;
+    }
+    .desk-pile { position: absolute; bottom: 48px; left: 58%; width: 20px; }
+    .desk-pile i {
+      display: block; height: 5px; margin-top: 2px; border-radius: 2px;
+      box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
+    }
+
+    /* potted plant on a shelf */
+    .lib-plant { position: absolute; bottom: 0; right: 14px; width: 20px; height: 34px; }
     .lib-plant::before {
       content: ''; position: absolute; bottom: 9px; left: 50%; margin-left: -10px;
       width: 20px; height: 20px;
@@ -284,15 +351,18 @@
       border-radius: 2px;
     }
 
+    /* open floor at the bottom — patrol area */
+    .lib-floor { position: relative; flex: 1 0 96px; }
+
     /* ── Mini robots ──────────────────────────────────────────────────────── */
     .mini-bot {
-      position: absolute; width: 40px;
+      position: absolute; width: 44px;
       filter: drop-shadow(0 4px 6px rgba(0,0,0,.5));
     }
     .mini-head {
-      width: 26px; height: 20px; margin: 0 auto; position: relative;
-      display: flex; align-items: center; justify-content: center; gap: 4px;
-      border-radius: 8px;
+      width: 28px; height: 21px; margin: 0 auto; position: relative;
+      display: flex; align-items: center; justify-content: center; gap: 5px;
+      border-radius: 9px;
       background: linear-gradient(145deg, #262C4F, #161B36);
       border: 1px solid rgba(167,139,250,.45);
     }
@@ -309,45 +379,46 @@
     }
     .mini-eye { width: 5px; height: 6px; border-radius: 50%; background: #EAF2FF; }
     .mini-body {
-      width: 20px; height: 13px; margin: -2px auto 0;
+      width: 22px; height: 14px; margin: -2px auto 0;
       border-radius: 6px;
       background: linear-gradient(160deg, #2E2553, #173A52);
       border: 1px solid rgba(103,232,249,.35);
     }
 
     /* walking patrol along the floor, flipping at each end */
-    .bot-walker  { bottom: 8px; left: 12px;  animation: bot-walk 10s ease-in-out infinite; }
-    .bot-carrier { bottom: 8px; left: 14px;  animation: bot-walk 13s ease-in-out -4s infinite; }
-    .bot-walker .mini-head, .bot-carrier .mini-head { animation: mini-bob .6s ease-in-out infinite; }
+    .bot-walker  { bottom: 10px; animation: bot-walk 14s ease-in-out infinite; }
+    .bot-carrier { bottom: 10px; animation: bot-walk 18s ease-in-out -6s infinite; }
+    .bot-walker .mini-head, .bot-carrier .mini-head,
+    .bot-worker .mini-head { animation: mini-bob .6s ease-in-out infinite; }
 
     /* stack of books carried in front */
     .bot-stack {
-      position: absolute; bottom: 2px; left: 50%; margin-left: -12px;
-      width: 24px; z-index: 2;
+      position: absolute; bottom: 2px; left: 50%; margin-left: -13px;
+      width: 26px; z-index: 2;
     }
     .bot-stack i {
       display: block; height: 6px; margin-top: 2px; border-radius: 2px;
       box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 2px rgba(0,0,0,.4);
     }
 
-    /* sitting + reading, gentle rocking, book held in front */
+    /* sitting on a shelf, reading — gentle rocking, book held in front */
     .bot-reader {
-      top: 145px; left: 20px;
+      bottom: 0; left: 10px;
       transform-origin: bottom center;
       animation: bot-read 3.4s ease-in-out infinite;
     }
     .bot-reader::after {
-      content: ''; position: absolute; bottom: 1px; left: 50%; margin-left: -11px;
-      width: 22px; height: 12px;
+      content: ''; position: absolute; bottom: 1px; left: 50%; margin-left: -12px;
+      width: 24px; height: 13px;
       background: linear-gradient(90deg, var(--purple) 0 47%, #E2E8F0 47% 53%, var(--cyan) 53% 100%);
       border-radius: 2px 2px 5px 5px;
       transform: perspective(40px) rotateX(28deg);
       box-shadow: 0 2px 4px rgba(0,0,0,.45);
     }
 
-    /* dozing on the top shelf — closed eyes, breathing pulse, floating zzz */
+    /* dozing on a shelf — closed eyes, breathing pulse, floating zzz */
     .bot-sleeper {
-      top: 53px; right: 22px;
+      bottom: 0; right: 12px;
       transform-origin: bottom center;
       animation: bot-sleep 3.8s ease-in-out infinite;
     }
@@ -361,7 +432,24 @@
     .zz:nth-of-type(2) { animation-delay: .9s;  font-size: 12px; }
     .zz:nth-of-type(3) { animation-delay: 1.8s; font-size: 14px; }
 
-    @media (max-width: 1180px) { .library { display: none; } }
+    /* climbing the ladder to fetch a book */
+    .bot-climber { right: 22px; bottom: 6px; animation: bot-climb 8s ease-in-out infinite; }
+
+    /* on tiptoes, pulling a book down from the shelf above */
+    .bot-fetcher {
+      left: 18px; bottom: 6px;
+      transform-origin: bottom center;
+      animation: bot-fetch 4.6s ease-in-out infinite;
+    }
+    .bot-fetcher::before { /* the coveted book */
+      content: ''; position: absolute; top: -13px; left: 50%; margin-left: -9px;
+      width: 18px; height: 6px; border-radius: 2px;
+      background: var(--purple);
+      box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 3px rgba(0,0,0,.4);
+    }
+
+    /* seated at the desk, body hidden behind the front panel */
+    .bot-worker { left: 26%; bottom: 30px; }
 
     /* ── Hero text overlay ────────────────────────────────────────────────── */
     .hero-overlay {
@@ -697,11 +785,21 @@
       50%      { transform: rotate(-115deg); }
     }
     @keyframes bot-walk {
-      0%   { transform: translateX(0)     scaleX(1); }
-      44%  { transform: translateX(104px) scaleX(1); }
-      50%  { transform: translateX(104px) scaleX(-1); }
-      94%  { transform: translateX(0)     scaleX(-1); }
-      100% { transform: translateX(0)     scaleX(1); }
+      0%   { left: 10px;              transform: scaleX(1); }
+      44%  { left: calc(100% - 56px); transform: scaleX(1); }
+      50%  { left: calc(100% - 56px); transform: scaleX(-1); }
+      94%  { left: 10px;              transform: scaleX(-1); }
+      100% { left: 10px;              transform: scaleX(1); }
+    }
+    @keyframes bot-climb {
+      0%, 12%   { transform: translate(0, 0); }
+      42%, 58%  { transform: translate(-13px, -88px); }
+      88%, 100% { transform: translate(0, 0); }
+    }
+    @keyframes bot-fetch { 0%, 100% { transform: scaleY(1); } 45%, 60% { transform: scaleY(1.13); } }
+    @keyframes aisle-walk {
+      0%, 100% { transform: translateX(-9px) scale(.92); }
+      50%      { transform: translateX(9px)  scale(1); }
     }
     @keyframes mini-bob  { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-1.5px); } }
     @keyframes bot-read  { 0%, 100% { transform: rotate(-2deg); } 50% { transform: rotate(2.5deg); } }
@@ -777,92 +875,87 @@
   </style>
 <canvas id="particles"></canvas>
 
+<!-- ── Library wings — full-height decor flanking the app (decorative) ──── -->
+<div class="library library-left" aria-hidden="true">
+  <div class="lib-shelf">
+    <i class="bk b1" style="--h:48px"></i><i class="bk b4 slim" style="--h:34px"></i>
+    <i class="bk b6" style="--h:52px"></i><i class="bk b5" style="--h:30px"></i>
+    <i class="bk b3 wide" style="--h:44px"></i><i class="bk b2 lean" style="--h:38px"></i>
+    <i class="bk b8" style="--h:54px"></i><i class="bk b7 slim" style="--h:36px"></i>
+    <i class="bk b1" style="--h:46px"></i><i class="bk b4" style="--h:32px"></i>
+    <i class="bk b5 slim" style="--h:42px"></i>
+  </div>
+  <div class="lib-shelf" style="justify-content:flex-end">
+    <i class="bk b3" style="--h:42px"></i><i class="bk b2 wide" style="--h:50px"></i>
+    <i class="bk b5 lean" style="--h:32px"></i><i class="bk b6" style="--h:46px"></i>
+    <i class="bk b4 slim" style="--h:36px"></i><i class="bk b1" style="--h:52px"></i>
+    <i class="bk b7" style="--h:38px"></i>
+    <div class="mini-bot bot-reader"><div class="mini-head"><span class="mini-eye"></span><span class="mini-eye"></span></div><div class="mini-body"></div></div>
+  </div>
+  <div class="lib-aisle"><div class="aisle-end"></div><span class="aisle-bot"></span></div>
+  <div class="lib-tall">
+    <div class="lib-shelf">
+      <i class="bk b8" style="--h:50px"></i><i class="bk b1 slim" style="--h:34px"></i>
+      <i class="bk b5" style="--h:42px"></i><i class="bk b3 lean" style="--h:36px"></i>
+      <i class="bk b2" style="--h:52px"></i><i class="bk b7 slim" style="--h:30px"></i>
+      <i class="bk b6 wide" style="--h:44px"></i>
+    </div>
+    <div class="lib-ladder"></div>
+    <div class="mini-bot bot-climber"><div class="mini-head"><span class="mini-eye"></span><span class="mini-eye"></span></div><div class="mini-body"></div></div>
+  </div>
+  <div class="lib-desk">
+    <div class="mini-bot bot-worker"><div class="mini-head"><span class="mini-eye"></span><span class="mini-eye"></span></div><div class="mini-body"></div></div>
+    <div class="desk-table"></div>
+    <div class="desk-screen"></div>
+  </div>
+  <div class="lib-floor">
+    <div class="mini-bot bot-walker"><div class="mini-head"><span class="mini-eye"></span><span class="mini-eye"></span></div><div class="mini-body"></div></div>
+  </div>
+</div>
+
+<div class="library library-right" aria-hidden="true">
+  <div class="lib-shelf">
+    <i class="bk b2" style="--h:46px"></i><i class="bk b3 wide" style="--h:52px"></i>
+    <i class="bk b5 lean" style="--h:32px"></i><i class="bk b6" style="--h:40px"></i>
+    <i class="bk b1 slim" style="--h:48px"></i><i class="bk b4" style="--h:34px"></i>
+    <i class="bk b8" style="--h:44px"></i>
+    <div class="mini-bot bot-sleeper"><div class="mini-head"><span class="mini-eye"></span><span class="mini-eye"></span></div><div class="mini-body"></div><span class="zz">z</span><span class="zz">z</span><span class="zz">z</span></div>
+  </div>
+  <div class="lib-shelf">
+    <i class="bk b7" style="--h:38px"></i><i class="bk b1 wide" style="--h:50px"></i>
+    <i class="bk b4 slim" style="--h:30px"></i><i class="bk b8 lean" style="--h:40px"></i>
+    <i class="bk b5" style="--h:52px"></i><i class="bk b2 slim" style="--h:34px"></i>
+    <i class="bk b3" style="--h:44px"></i><i class="bk b6" style="--h:36px"></i>
+    <div class="lib-plant"></div>
+  </div>
+  <div class="lib-aisle"><div class="aisle-end"></div><span class="aisle-bot" style="animation-delay:-4s"></span></div>
+  <div class="lib-tall">
+    <div class="lib-shelf" style="justify-content:flex-end">
+      <i class="bk b6" style="--h:44px"></i><i class="bk b4 slim" style="--h:30px"></i>
+      <i class="bk b1" style="--h:52px"></i><i class="bk b5 lean" style="--h:36px"></i>
+      <i class="bk b3 wide" style="--h:42px"></i><i class="bk b2" style="--h:34px"></i>
+    </div>
+    <div class="mini-bot bot-fetcher"><div class="mini-head"><span class="mini-eye"></span><span class="mini-eye"></span></div><div class="mini-body"></div></div>
+  </div>
+  <div class="lib-desk">
+    <div class="mini-bot bot-worker"><div class="mini-head"><span class="mini-eye"></span><span class="mini-eye"></span></div><div class="mini-body"></div></div>
+    <div class="desk-table"></div>
+    <div class="desk-pile"><i style="background:#06B6D4"></i><i style="background:#A78BFA"></i><i style="background:#E2E8F0"></i></div>
+  </div>
+  <div class="lib-floor">
+    <div class="mini-bot bot-carrier">
+      <div class="bot-stack"><i style="background:#7C3AED"></i><i style="background:#67E8F9"></i><i style="background:#E2E8F0"></i></div>
+      <div class="mini-head"><span class="mini-eye"></span><span class="mini-eye"></span></div><div class="mini-body"></div>
+    </div>
+  </div>
+</div>
+
+
   <div id="app">
     <!-- Hero — cinematic amphitheater with AI professor -->
     <header class="hero">
 
       <!-- Library wing — left (decorative) -->
-      <div class="library library-left" aria-hidden="true">
-        <div class="lib-shelf">
-          <i class="bk" style="--h:40px;--c:#7C3AED"></i>
-          <i class="bk" style="--h:32px;--c:#67E8F9"></i>
-          <i class="bk" style="--h:44px;--c:#4C3D8F"></i>
-          <i class="bk" style="--h:28px;--c:#E2E8F0"></i>
-          <i class="bk" style="--h:38px;--c:#06B6D4"></i>
-          <i class="bk lean" style="--h:34px;--c:#A78BFA"></i>
-          <i class="bk" style="--h:42px;--c:#2E2553"></i>
-          <i class="bk" style="--h:30px;--c:#1E6F8F"></i>
-        </div>
-        <div class="lib-shelf" style="justify-content:flex-end">
-          <i class="bk" style="--h:36px;--c:#06B6D4"></i>
-          <i class="bk" style="--h:44px;--c:#A78BFA"></i>
-          <i class="bk lean" style="--h:30px;--c:#E2E8F0"></i>
-          <i class="bk" style="--h:40px;--c:#4C3D8F"></i>
-          <i class="bk" style="--h:34px;--c:#67E8F9"></i>
-        </div>
-        <div class="lib-shelf">
-          <i class="bk" style="--h:42px;--c:#2E2553"></i>
-          <i class="bk" style="--h:30px;--c:#7C3AED"></i>
-          <i class="bk" style="--h:38px;--c:#E2E8F0"></i>
-          <i class="bk lean" style="--h:32px;--c:#06B6D4"></i>
-          <i class="bk" style="--h:44px;--c:#A78BFA"></i>
-          <i class="bk" style="--h:28px;--c:#1E6F8F"></i>
-          <i class="bk" style="--h:36px;--c:#4C3D8F"></i>
-        </div>
-        <div class="lib-ladder"></div>
-        <div class="mini-bot bot-reader">
-          <div class="mini-head"><span class="mini-eye"></span><span class="mini-eye"></span></div>
-          <div class="mini-body"></div>
-        </div>
-        <div class="mini-bot bot-walker">
-          <div class="mini-head"><span class="mini-eye"></span><span class="mini-eye"></span></div>
-          <div class="mini-body"></div>
-        </div>
-      </div>
-
-      <!-- Library wing — right (decorative) -->
-      <div class="library library-right" aria-hidden="true">
-        <div class="lib-shelf">
-          <i class="bk" style="--h:38px;--c:#A78BFA"></i>
-          <i class="bk" style="--h:44px;--c:#06B6D4"></i>
-          <i class="bk lean" style="--h:30px;--c:#E2E8F0"></i>
-          <i class="bk" style="--h:34px;--c:#4C3D8F"></i>
-          <i class="bk" style="--h:40px;--c:#7C3AED"></i>
-        </div>
-        <div class="lib-shelf">
-          <i class="bk" style="--h:34px;--c:#1E6F8F"></i>
-          <i class="bk" style="--h:42px;--c:#7C3AED"></i>
-          <i class="bk" style="--h:28px;--c:#67E8F9"></i>
-          <i class="bk lean" style="--h:36px;--c:#2E2553"></i>
-          <i class="bk" style="--h:44px;--c:#E2E8F0"></i>
-          <i class="bk" style="--h:32px;--c:#A78BFA"></i>
-          <i class="bk" style="--h:38px;--c:#06B6D4"></i>
-        </div>
-        <div class="lib-shelf" style="justify-content:flex-end">
-          <i class="bk" style="--h:40px;--c:#4C3D8F"></i>
-          <i class="bk" style="--h:30px;--c:#06B6D4"></i>
-          <i class="bk" style="--h:44px;--c:#A78BFA"></i>
-          <i class="bk lean" style="--h:34px;--c:#1E6F8F"></i>
-          <i class="bk" style="--h:38px;--c:#E2E8F0"></i>
-          <i class="bk" style="--h:28px;--c:#7C3AED"></i>
-        </div>
-        <div class="lib-plant"></div>
-        <div class="mini-bot bot-sleeper">
-          <div class="mini-head"><span class="mini-eye"></span><span class="mini-eye"></span></div>
-          <div class="mini-body"></div>
-          <span class="zz">z</span><span class="zz">z</span><span class="zz">z</span>
-        </div>
-        <div class="mini-bot bot-carrier">
-          <div class="bot-stack">
-            <i style="background:#7C3AED"></i>
-            <i style="background:#67E8F9"></i>
-            <i style="background:#E2E8F0"></i>
-          </div>
-          <div class="mini-head"><span class="mini-eye"></span><span class="mini-eye"></span></div>
-          <div class="mini-body"></div>
-        </div>
-      </div>
-
       <div class="amphitheater" id="amphitheater">
         <div class="amphi-beam"></div>