<!---
         .iLU1L:....   sL  .   BB                                                          sBBBBBBBrBBB.  :YQBBBBBi                            
               .SQQP2r:         LBQZBBbvi.DB..U                                                    :BBBBBBqKBBBBBB.       :gBBg                        
            iZBq:                BDSr    .ivILBB::                                              .7BBBBM:BBr 7BBB               jBD.                    
          7dP.                    g1         rBBBYB.7q..                                     :gBBXBBB   r    BB                  :gP                   
        iJ:                       .:           BBBBBBBBBBBj                              :jBBBBBBQjB         gY                     1L                 
      .i                                        BBBISv.rYBBBBBBQ5Yv                     BBZBS   BBB          M                        .7               
     :.                                         .BB        BEBBBBBBB                   BBBR.    iB1                                                    
                                                 .B           BBBBBBB.     .ZBbB1    vBB        PB                                                     
                                                  :L        .  DB:BBBBS    IBBBBBi idB5        .S                                                      
                                                                7     Pr5JPi.BBBBBBg7S         :                                                       
                                                                       vBdBBBBBBBBBBZBBS                                                               
                                                                     BBBI QBBBvZBBBBBB:                                                                
                                                                     BBBR7KBBM7ZBBBBBBB                                                                
                                                                    :BBB..BBBBBBBBQ  KBB                                                               
                                                                   :BBD  BBBBBBBB    JBr                                                               
                                                                   QBB  BBQBBBBBBQ    BB                                                               
                                                                  .BB: BBBBQvBBBBB.   :rr                                                              
                                                                  BBB  dB U. BBBBB    iBB.                                                             
                                                                  BB   BBX7U BBBBg    :BB:                                                             
                                                                  BB  DBBBLBBRBBBB     bBZ                                                             
                                                                 7BB BBBBBB1   BBBJ    jB7                                                             
                                                                  BB BBBBBB    :BBB    rB.                                                             
                                                                  QK BBBBB      BBBX   rB                                                              
                                                                  BB SZBBB       BBB   BB                                                              
                                                                  BBB rBBQ       dBBi bBB                                                              
                                                                  BB :vBBBP      BBBriQBB                                                              
                                                                   BBrr7MB.     .BBB rBBR                                                              
                                                                       ZqB      gBB  .I.                                                               
                                                                        BBv    PBB                                                                     
                                                                        :BQ    BBB                                                                     
                                                                         BBr    YB                                                                     
                                                                         QrK  .rE1                                                                     
                                                                         : Xi   r.                                                                     
                                                                         BLL:   i                                                                      
                                                                          s.    i                                                                      
                                       ────────────────────────────────────────────────────────────────────────────
                                        ▓│              ...::[ SCROLL DOWN TO VIEW SOURCE ]::...                 │▓
                                        ▓│──────────────────────────────────────────────────────────────────────│▓
                                       ──────┘         ░░ (Incase curiosity kills the cat): ░░            └──────
                                         │                                                                      │
                                         │        document       │
                                         │                                                                      │
                                         │      “To my Loveinge good ffrend & contreymann Mr. Wm Shackespere,” dated “ffrom the Bell in Carter Lane the 25 October 1598” and signed “Ryc. Quyney.”      │
                                         └──────────────────────────────────────────────────────────────────────┘


╠───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╣
║--------------------------------------------------------------DREAMWEAVER-----------------------------------------------------------║
╠───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╣
║                               *      *           *    *      *       *         *              *            *        *        *      * ║
║    *      *         *                 *    *            *        *        *           *   *      *     *       *         *       *    ║
║                *          *      *                *         *         *    _,'|   *         _.-''``-...___..--';)    *      *         ║
║   *    *   *                           *      *         *        *        /_ \'.      __..-' ,      ,--...--'''                   *   ║
║                    *           *     *     *        *        *        *  <\    .`--'''       `     /'           *      *       *      ║
║       *      *            *                      *       *        *       `-';'               ;   ; ;    *    *                       ║
║  *      *                      *    *    *    *               *     __...--''     ___...--_..'  .;.'              *     *          *  ║
║                    *   *                             *     *    *  (,__....----'''       (,..--''         *                   *       ║
║    *       *    *             *        ╔═══════════════════════════════════════════════════════════╗  *          *     *              ║
║                        *           *   ║                                                           ║        *               *    *    ║
║        /\         *       /\  *        ║   FIRST WITCH 
When shall we three meet again?
In thunder, lightning, or in rain?
SECOND WITCH 
When the hurly-burly’s done,
When the battle’s lost and won.
THIRD WITCH 
That will be ere the set of sun.
FIRST WITCH 
Where the place?
SECOND WITCH  Upon the heath.
THIRD WITCH 
There to meet with Macbeth.
FIRST WITCH  I come, Graymalkin.
SECOND WITCH  Paddock calls.
THIRD WITCH  Anon.
ALL 
Fair is foul, and foul is fair;
Hover through the fog and filthy air.
They exit. *    *       *               *    ║
║                   *          *         ║                                                           ║                    *             ║
║   *     *    *                         ╚═══════════════════════════════════════════════════════════╝  *        *              *       ║
║                  *      *         *     *         *   *        *         *      *         *    *                    *             *   ║
║ *   *     *                  *       *    *    *         *           *      *        *             *       *            *             ║
║                  *      *                        *   *        *                *           *           *       *            *         ║
║  *      *                       *     *    *            *           *   *            *         *                     *          *     ║
║                *         *         *          *     *      *     *          *    *       *         *      *     *        *            ║
╠───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╣
║--------------------------------------------------------------INFORMATION----------------------------------------------------------║
╠───────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────╣


	🎬
 --->
<!DOCTYPE html>
<html lang="en" class="👗">
<html lang="en">

	<link rel="preconnect" href="www.missionjuno.swri.edu">
		<link rel="preconnect" href="d2xkkdgjnsfvb0.cloudfront.net">
		<link rel="dns-prefetch" href="//ajax.googleapis.com">
    <!--ink city layout 068
     -Created by www.inkrealm.info 
     (inspired by desire 
     and the spirit of innovation)
        ja: "私の個人情報を販売しない(カリフォルニア州消費者プライバシー法)",
    	Частная личная информация, Informações pessoais privadas, 
    Persónulegar upplýsingar, 
    Private personal information, ព័ត៌មានផ្ទាល់ខ្លួនឯកជន
    	(Verbraucherschutzgesetz der Präfektur Kalifornien)
            en: "Do Not Sell My Info (KKKalifornia)"---> 
     
    <title data-rh="true">www.inkrealm.info - literature, film, art and more...</title>
    <meta data-rh="true" name="description" content="A writer's website, featuring an extensive list of films about the craft with posters and original art as well as artifacts. Video and audio downloads. The TWO SKINNY GIRLS often places covers and even new songs on the homepage. Inkrealm includes tools for TIKTOK and an AMSR site for MEDITATION. A unique place for creative souls. A Portal to escape the ordinary. Eclectic and frequently updated."/>
    <meta data-rh="true" property="og:url" content="https://www.inkrealm.info"/>
    <meta data-rh="true" property="og:type" content="website"/>
    <meta data-rh="true" property="og:title" content="INKREALM - writing, music, and the visual arts"/>

    <meta property="tiktok:app_id" content="@twoskinnygirls" />
    <meta name="twitter:site" content="@inkrealm" />
    <meta name="slack-app-id" content="f060RUD44R3" />

    <link rel="shortcut icon" href="./Images//favicon.ico" />
    <link rel="manifest" href="manifest.json">

    <!-- All in One SEO 4.6.6.6 -->
    <meta name="description" content="The writer at work on several projects."/>
    <link rel="canonical" href="https://www.inkrealm.info//" />
    <link rel="next" href="https://www.inkrealm.info/1991" />
    <meta property="og:site_name" content="inkrealm" />
    <meta property="og:type" content="art" />
    <meta property="og:title" content="inkrealm" />
    <meta property="og:description" content="music and art." />
    <meta property="og:url" content="https://www.inkrealm.info/" />
    <meta property="fb:app_id" content="600155496" />
    <meta property="fb:admins" content="10158559392645497" />
    <meta property="og:image" content="https://res.cloudinary.com/crunchbase-production/image/upload/c_lpad,f_auto,q_auto:eco,dpr_1/auxjru3vaajlhx7f8t9e" />
    <meta property="og:image:secure_url" content="https://res.cloudinary.com/crunchbase-production/image/upload/c_lpad,h_170,w_170,f_auto,b_white,q_auto:eco,dpr_1/auxjru3vaajlhx7f8t9e" />
    <meta property="article:published_time" content="2022-11-11T22:40:34Z" />
    <meta property="article:modified_time" content="2022-11-11T22:40:34Z" />
    <meta property="article:publisher" content="https://www.wordstar.nexus" />
    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:site" content="@inkrealm" />
    <meta name="twitter:domain" content="inkrealm6.wordpress.com" />
    <meta name="twitter:title" content="inkrealm" />
    <meta name="twitter:description" content="headquarters." />
    <meta name="twitter:image" content="https://twitter.com/inkrealm/photo" />
    <meta name="google" content="nositelinkssearchbox" />
    <!-- All in One SEO -->

    <!-- ❂  £  ₿ £ 0 ∆元 ∆￦ ∆ 🂶￥  £ 🂶￥
     £ ឯ    0元 ∆￦ ∆ ¢ᶄᶄ ❂ ⎈ ⑱ ♘𝅙 ₪ я 
     ♢ for investment advice : ⚡
    +•1=9=1•7=3•1=0•0=1•1•6• --->
    <script type="application/ld+json">
    {
      "@context": "https://inkrealm.info",
      "@type": "BreadcrumbList",
      "itemListElement": [{
        "@type": "ListItem",
        "position": 1,
        "name": "Books",
        "item": "https://inkrealm.info/1991"
      },{
        "@type": "ListItem",
        "position": 2,
        "name": "link hype",
        "item": "https://wordstar.nexus"
      },{
        "@type": "ListItem",
        "position": 3,
        "name": "Ink Realm"
      }]
    }
    </script>

    <link type="application/rss+xml" rel="alternate" title="two skinny girls" href="https://media.rss.com/inkrealm/feed.xml"/>
    <link rel="shortcut icon" href="https://raw.githubusercontent.com/ghostm68/inktwo/main/Images/favicon.ico" />
  

    <script type="7a66755cb61411285026116f-text/javascript">
        console.log("INKREALM");
        window.currentPage = {
            pageId: "home",
            isMainPage: true
        };
    </script>
<head>
    <meta charset="utf-8"/>
    <!-- Removed viewport meta for desktop-only focus, or adjust as needed -->
    <!-- <meta content="width=device-width, initial-scale=1.0" name="viewport"/> --> 
<title>inkrealm.info</title>
<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries" type="7a66755cb61411285026116f-text/javascript"></script>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&amp;display=swap" rel="stylesheet"/>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"/>
<link crossorigin="anonymous" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA==" referrerpolicy="no-referrer" rel="stylesheet"/>
<style>
        @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');
        @import url('https://fonts.googleapis.com/icon?family=Material+Icons');
        
        * {
            font-family: 'Roboto', sans-serif;
        }

        .video-background {
            position: fixed;
            right: 0;
            bottom: 0;
            min-width: 100%;
            min-height: 100%;
            width: auto;
            height: auto;
            z-index: -100;
            background: linear-gradient(45deg, #1a1a2e, #16213e, #0f3460);
            background-size: 400% 400%;
            animation: gradient-shift 8s ease infinite;
        }

        @keyframes gradient-shift {
            0% { background-position: 0% 50%; }
            50% { background-position: 100% 50%; }
            100% { background-position: 0% 50%; }
        }

        .video-background::after {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-image: linear-gradient(rgba(0, 0, 0, 0.5) 50%, transparent 50%);
            background-size: 100% 4px;
            animation: scanline 0.2s linear infinite;
            z-index: -99;
        }

        @keyframes scanline {
            from { background-position: 0 0; }
            to { background-position: 0 -4px; }
        }

        @keyframes pulse {
            0% { transform: scaleX(0); }
            50% { transform: scaleX(1); }
            100% { transform: scaleX(0); }
        }

        .data-stream {
            display: flex;
            align-items: flex-end;
            height: 24px;
            gap: 2px;
        }

        .data-bar {
            width: 3px;
            background-color: #3b82f6;
            animation: data-stream-wave 1.5s infinite ease-in-out;
        }

        @keyframes data-stream-wave {
            0%, 100% { height: 20%; }
            50% { height: 100%; }
        }

        .sidebar-scroll::-webkit-scrollbar {
            width: 8px;
        }

        .sidebar-scroll::-webkit-scrollbar-track {
            background: rgba(31, 41, 55, 0.5);
        }

        .sidebar-scroll::-webkit-scrollbar-thumb {
            background-color: #3B82F6;
            border-radius: 4px;
        }

        .sidebar-scroll::-webkit-scrollbar-thumb:hover {
            background-color: #2563EB;
        }

        #clock {
            animation: clock-flicker 1.5s infinite;
        }

        @keyframes clock-flicker {
            0%, 19%, 21%, 53%, 55%, 100% { opacity: 1; }
            20%, 54% { opacity: 0.8; }
        }

        #search-results-container {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s ease-in-out, padding 0.3s ease-in-out, opacity 0.2s ease-in-out;
            opacity: 0;
        }

        #search-results-container.expanded {
            max-height: 400px;
            padding-top: 1rem;
            padding-bottom: 1rem;
            opacity: 1;
        }

        .search-item {
            transition: all 0.2s ease-in-out;
            padding: 12px 16px;
            border-radius: 8px;
            border: 1px solid transparent;
        }

        .search-item:hover {
            background-color: rgba(59, 130, 246, 0.1);
            border-color: rgba(59, 130, 246, 0.3);
            transform: translateX(4px);
        }

        .dropdown:hover .dropdown-menu {
            display: block !important;
        }

        @keyframes matrix-rain {
            0% { transform: translateY(-100vh); opacity: 0; }
            10% { opacity: 1; }
            90% { opacity: 1; }
            100% { transform: translateY(100vh); opacity: 0; }
        }

        .matrix-char {
            position: absolute;
            color: #00ff41;
            font-family: 'Courier New', monospace;
            font-size: 14px;
            animation: matrix-rain 3s linear infinite;
        }

        .loading-spinner {
            border: 2px solid rgba(59, 130, 246, 0.1);
            border-radius: 50%;
            border-top: 2px solid #3b82f6;
            width: 16px;
            height: 16px;
            animation: spin 1s linear infinite;
        }

        @keyframes spin {
            0% { transform: rotate(0deg); }
            100% { transform: rotate(360deg); }
        }

        .typewriter {
            overflow: hidden;
            border-right: 2px solid #3b82f6;
            white-space: nowrap;
            animation: typewriter 3s steps(40, end), blink 0.75s step-end infinite;
        }

        @keyframes typewriter {
            from { width: 0; }
            to { width: 100%; }
        }

        @keyframes blink {
            from, to { border-color: transparent; }
            50% { border-color: #3b82f6; }
        }

        /* Material Icons fallback */
        .material-icons {
            font-family: 'Material Icons', Arial, sans-serif;
            font-weight: normal;
            font-style: normal;
            font-size: 24px;
            line-height: 1;
            letter-spacing: normal;
            text-transform: none;
            display: inline-block;
            white-space: nowrap;
            word-wrap: normal;
            direction: ltr;
        }

        /* Icon fallbacks using Unicode symbols */
        .icon-search::before { content: "🔍"; }
        .icon-close::before { content: "✕"; }
        .icon-menu::before { content: "☰"; }
        .icon-play::before { content: "▶"; }
        .icon-pause::before { content: "⏸"; }
        .icon-music::before { content: "♪"; }
        .icon-video::before { content: "📹"; }
        .icon-mail::before { content: "✉"; }
        .icon-server::before { content: "🖥"; }
        .icon-home::before { content: "🏠"; }
        .icon-expand::before { content: "⌄"; }
        .icon-computer::before { content: "💻"; }
    </style>
    
</head>
<body class="bg-gray-900 text-white overflow-hidden">
<div class="fixed top-0 left-0 w-full bg-gray-900 bg-opacity-80 backdrop-blur-sm z-50 shadow-lg">
<div class="flex items-center justify-between px-4 h-10">
<div class="flex items-center">
<img alt="Dragon logo" class="w-8 h-8 mr-2 invert" src="https://lh3.googleusercontent.com/aida-public/AB6AXuAcbStbQLOyPX5fhq8T0sYnOFA7tuUx6r48nj052iOHQ4OucYLPcGOAxc1wHqv0DWw6UDn_0iUnB30r2SvpCLC3cCed_szUhnrixyPxL4uvn8bMM_W9Lbu1WxrQAOxAhjKPcM542vEzYboZ-DQ39m7kriK9NKZkH4uzc3cxUXG0HccGjFeT7L-nNAnWP-HbmbrmsoaLcfaJz7zPo5MnS9zLYlQ5WIwX3DhKEusirn-rQK9_Vh7XQ_tO1W2l6XlFMtfy6WDSboMTObA"/>
</div>
<div class="flex-1 flex justify-center items-center space-x-4">
<div class="flex items-center space-x-2 bg-blue-900 bg-opacity-50 p-1 rounded-md">
<div class="w-2 h-2 bg-green-500 rounded-full animate-pulse"></div>
<div class="ping-display text-xs text-white font-mono" id="ping-latency">Ping: 27ms</div>
</div>
<div class="relative w-full max-w-sm">
<div class="absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none"> <span class="material-icons text-gray-400 text-sm">search</span> </div>
<input class="w-full bg-gray-700 border border-gray-600 rounded-md h-7 pl-9 pr-3 text-sm text-white placeholder-gray-400 focus:ring-2 focus:ring-blue-500 focus:outline-none" id="search-input" placeholder="Search..." type="text"/>
</div>
<div class="data-stream w-24">
<div class="data-bar" style="animation-delay: -0.1s; animation-duration: 1.2s;"></div>
<div class="data-bar" style="animation-delay: -0.2s; animation-duration: 1.5s;"></div>
<div class="data-bar" style="animation-delay: -0.3s; animation-duration: 1.1s;"></div>
<div class="data-bar" style="animation-delay: -0.4s; animation-duration: 1.4s;"></div>
<div class="data-bar" style="animation-delay: -0.5s; animation-duration: 1.6s;"></div>
<div class="data-bar" style="animation-delay: -0.6s; animation-duration: 1.3s;"></div>
<div class="data-bar" style="animation-delay: -0.7s; animation-duration: 1.7s;"></div>
<div class="data-bar" style="animation-delay: -0.8s; animation-duration: 1.2s;"></div>
<div class="data-bar" style="animation-delay: -0.9s; animation-duration: 1.6s;"></div>
<div class="data-bar" style="animation-delay: -1s; animation-duration: 1.3s;"></div>
</div>
<div class="dropdown relative">
<button class="flex items-center p-1 rounded-lg hover:bg-gray-700 transition-colors duration-200 text-left text-sm">
<span class="material-icons mr-1 text-base">dns</span>wordstar.nexus
<span class="material-icons ml-auto text-xs">arrow_drop_down</span>
</button>
<ul class="dropdown-menu hidden mt-1 absolute left-0 w-48 bg-gray-700 bg-opacity-90 rounded-b-lg py-2 z-10 sidebar-scroll max-h-60 overflow-y-auto">
<li><a class="flex items-center px-4 py-2 hover:bg-gray-600 transition-colors duration-200 text-sm" href="https://wordstar.nexus/"><span class="material-icons mr-3 text-base">wordstar</span>nexus</a></li>
<li><a class="flex items-center px-4 py-2 hover:bg-gray-600 transition-colors duration-200 text-sm" href="https://wordstar.nexus/birch">Birch</a></li>
<li><a class="flex items-center px-4 py-2 hover:bg-gray-600 transition-colors duration-200 text-sm" href="https://wordstar.nexus/dreamweaver">Dreamweaver</a></li>
<li><a class="flex items-center px-4 py-2 hover:bg-gray-600 transition-colors duration-200 text-sm" href="https://wordstar.nexus/dejavuglitches">Dejavuglitches</a></li>
  <li><a class="flex items-center px-4 py-2 hover:bg-gray-600 transition-colors duration-200 text-sm" href="https://wordstar.nexus/nc17">nc17</a></li>    
<li><a class="flex items-center px-4 py-2 hover:bg-gray-600 transition-colors duration-200 text-sm" href="https://wordstar.nexus/wip">WIP</a></li>
<li><a class="flex items-center px-4 py-2 hover:bg-gray-600 transition-colors duration-200 text-sm" href="https://wordstar.nexus/bakedalaska">BakedAlaska</a></li>
<li><a class="flex items-center px-4 py-2 hover:bg-gray-600 transition-colors duration-200 text-sm" href="https://wordstar.nexus/90263">90263</a></li>
<li><a class="flex items-center px-4 py-2 hover:bg-gray-600 transition-colors duration-200 text-sm" href="https://wordstar.nexus/displaywriter">DisplayWriter</a></li>
<li><a class="flex items-center px-4 py-2 hover:bg-gray-600 transition-colors duration-200 text-sm" href="https://wordstar.nexus/墨水">墨水</a></li>
<li><a class="flex items-center px-4 py-2 hover:bg-gray-600 transition-colors duration-200 text-sm" href="https://wordstar.nexus/ighsau">Ighsau</a></li>
<li><a class="flex items-center px-4 py-2 hover:bg-gray-600 transition-colors duration-200 text-sm" href="https://wordstar.nexus/netherlands">Netherlands</a></li>
<li><a class="flex items-center px-4 py-2 hover:bg-gray-600 transition-colors duration-200 text-sm" href="https://wordstar.nexus/ai">AI</a></li>
<li><a class="flex items-center px-4 py-2 hover:bg-gray-600 transition-colors duration-200 text-sm" href="https://wordstar.nexus/typewriter">Typewriter</a></li>
<li><a class="flex items-center px-4 py-2 hover:bg-gray-600 transition-colors duration-200 text-sm" href="https://wordstar.nexus/seven">Seven</a></li>
 <li><a class="flex items-center px-4 py-2 hover:bg-gray-600 transition-colors duration-200 text-sm" href="https://wordstar.nexus/seven">daslexicon</a></li>   
</ul>
</div>
</div>
        
    
</div>
<div class="bg-gray-800 bg-opacity-90 backdrop-blur-md px-4" id="search-results-container">
<div class="max-w-7xl mx-auto">
<div class="flex justify-between items-center mb-4 pt-4">
<h2 class="text-xl font-semibold">Search Results</h2>
<button class="text-gray-400 hover:text-white" id="close-search-results">
<span class="material-icons">expand_less</span>
</button>
</div>
<div class="space-y-2 search-results sidebar-scroll pr-2 pb-4">
<a class="block text-blue-400 hover:text-blue-300 hover:underline" href="https://inkrealm.info/atari" target="_blank">Atari</a>
<a class="block text-blue-400 hover:text-blue-300 hover:underline" href="https://inkrealm.info/1991" target="_blank">1991</a>
<a class="block text-blue-400 hover:text-blue-300 hover:underline" href="https://inkrealm.info/coven" target="_blank">Coven</a>
<a class="block text-blue-400 hover:text-blue-300 hover:underline" href="https://inkrealm.info/home" target="_blank">home</a>
</div>
</div>
</div>
</div>
<video autoplay="" class="video-background" loop="" muted="">
<source src="https://inkrealm.info/1991inkrealm_20230123_174107556.mp4" type="video/mp4"/> Your browser does not support the video tag. </video>
<div class="flex h-screen pt-10">
<aside class="w-64 bg-gray-800 bg-opacity-70 backdrop-blur-sm flex flex-col p-4">
<div class="flex items-center mb-6 flex-shrink-0">
<h1 class="text-2xl font-bold">www.inkrealm.info</h1>
</div>
<nav class="flex-grow overflow-y-auto sidebar-scroll pr-2">
<ul>
<li class="mb-2"><a class="flex items-center p-2 rounded-lg hover:bg-gray-700 transition-colors duration-200" href="https://inkrealm.info/runway" target="_blank"><span class="material-icons mr-3">_edu</span>runway</a></li>

    <li><a href="https://inkrealm.info/home" target="_blank">_edu</a></li>
    <li><a href="https://inkrealm.info/deluxe" target="_blank">explore Deluxe</a>
        <ul>
            <li><a href="https://inkrealm.info/cloud" target="_blank">group Collaboration</a></li>
            <li><a href="https://inkrealm.info/about" target="_blank">source about</a></li>
        </ul>
    </li>
    <li><a href="https://inkrealm.info/ravenlux" target="_blank">🛍️ retro</a></li>
    <li><a href="https://inkrealm.info/fashion" target="_blank">🗺️ style</a></li>
    <li><a href="https://inkrealm.info/twoskinnygirls" target="_blank">🎵 2sknygrls</a></li>
    <li><a href="https://www.paypal.com/donate/?hosted_button_id=EMCHF6KEL7CHA" target="_blank">widget Application</a>
        <ul>
            <li><a href="https://inkrealm.info/quantum" target="_blank">+ Processor</a></li>
        </ul>
    </li>
    <li><a href="https://inkrealm.info/app" target="_blank">app gem</a></li>
    <li><a href="https://inkrealm.info/66" target="_blank">📘</a></li>
    <li><a href="https://inkrealm.info/99" target="_blank">🐦</a></li>
    <li><a href="https://inkrealm.info/55" target="_blank">📷</a></li>
    <li><a href="https://inkrealm.info/1991" target="_blank">📺</a></li>
</ul>
</nav>
<div class="text-xs text-gray-400 flex-shrink-0 mt-4">
<p class="mb-1"><a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="b1d8dfdac3d4d0dddcf1c6dec3d5c2c5d0c39fdfd4c9c4c2">[email&#160;protected]</a></p>
<p>© 2024 inkrealm.info</p>
</div>
</aside>
<main class="flex-1 flex flex-col">
<header class="bg-gray-900 bg-opacity-80 backdrop-blur-sm flex items-center justify-between p-2 shadow-lg">
<div class="flex items-center"> <span class="material-icons text-gray-400">computer</span> <span class="ml-2">writer.musician.visual artist...</span> </div>

</header>
<div class="flex-1 p-8 relative">
<div class="absolute top-16 left-16 cursor-pointer" id="mp3-icon" onclick="if (!window.__cfRLUnblockHandlers) return false; togglePlayer('mp3')" data-cf-modified-7a66755cb61411285026116f-="">
<div class="flex flex-col items-center text-center group"> <span class="material-icons text-6xl text-white group-hover:text-teal-400 transition-colors duration-300">music_note</span>
<p class="text-xs mt-1">Music Player</p>
</div>
</div>
<div class="absolute top-16 left-48 cursor-pointer" id="video-icon" onclick="if (!window.__cfRLUnblockHandlers) return false; togglePlayer('video')" data-cf-modified-7a66755cb61411285026116f-="">
<div class="flex flex-col items-center text-center group"> <span class="material-icons text-6xl text-white group-hover:text-blue-400 transition-colors duration-300">movie</span>
<p class="text-xs mt-1">Video Player</p>
</div>
</div>
<div class="absolute top-16 left-80" id="contact-icon">
<a class="flex flex-col items-center text-center group cursor-pointer" href="/cdn-cgi/l/email-protection#294047425b4c484544695e465b4d5a5d485b07474c515c5a">
<span class="material-icons text-6xl text-white group-hover:text-yellow-400 transition-colors duration-300">contact_mail</span>
<p class="text-xs mt-1">Contact</p>
</a>
</div>
      
           <div class="absolute top-1/4 left-1/4 w-96 bg-gray-800 bg-opacity-70 backdrop-blur-md rounded-lg shadow-2xl flex-col cursor-move hidden" id="mp3-widget">
    <div class="bg-gray-900 p-2 flex justify-between items-center rounded-t-lg" id="mp3-header">
        <h2 class="text-sm font-semibold">MP3 Player</h2>
        <span class="material-icons text-gray-400 cursor-pointer" onclick="if (!window.__cfRLUnblockHandlers) return false; togglePlayer('mp3')" data-cf-modified-7a66755cb61411285026116f-="">close</span>
    </div>
    <div class="p-6 flex flex-col items-center">
        <!-- Album art image -->
        <img alt="Album art" class="w-32 h-32 rounded-lg shadow-lg mb-4" src="https://inkrealm.wordpress.com/wp-content/uploads/2011/10/tumblr_lta0r6z6n91qgque3o1_1280.jpg"/>

        <!-- Audio element for the song -->
        <audio controls>
            <source src="DEMI two skinny girls.mp3" type="audio/mpeg">
            Your browser does not support the audio element.
        </audio>

        <h3 class="text-lg font-semibold">twoSKINNYgirls - </h3>
        <p class="text-sm text-gray-400 mb-4">demi</p>
        <div class="w-full bg-gray-700 rounded-full h-1.5 mb-4">
            <div class="bg-teal-400 h-1.5 rounded-full" style="width: 45%"></div>
        </div>
    
    </div>
</div>
<div class="absolute top-1/4 left-1/3 w-[500px] bg-gray-800 bg-opacity-70 backdrop-blur-md rounded-lg shadow-2xl flex-col cursor-move hidden" id="video-widget">
<div class="bg-gray-900 p-2 flex justify-between items-center rounded-t-lg" id="video-header">
<h2 class="text-sm font-semibold">Video Player</h2> <span class="material-icons text-gray-400 cursor-pointer" onclick="if (!window.__cfRLUnblockHandlers) return false; togglePlayer('video')" data-cf-modified-7a66755cb61411285026116f-="">close</span>
</div>
<div class="p-4">
<div class="aspect-video bg-black rounded-md">
<video class="w-full h-full" controls="" src="https://dn721808.ca.archive.org/0/items/times-square-1980/Times%20Square%20%281980%29.mp4"></video>
</div>
<div class="mt-4">
<h3 class="text-lg font-semibold">Surfer's Journey</h3>
<p class="text-sm text-gray-400">Chasing the perfect wave</p>
<div class="flex items-center justify-center space-x-6 mt-4"> <span class="material-icons text-gray-400 hover:text-white cursor-pointer text-3xl">replay_10</span> <span class="material-icons text-white bg-blue-500 rounded-full p-3 text-4xl cursor-pointer hover:bg-blue-600">play_arrow</span> <span class="material-icons text-gray-400 hover:text-white cursor-pointer text-3xl">forward_10</span> </div>
</div>
</div>
</div>
</div>
<footer class="bg-blue-900 bg-opacity-30 backdrop-blur-sm p-4 flex items-center justify-between text-sm text-gray-300">
<div class="flex items-center space-x-6"> <span class="font-semibold text-gray-100">Tier 2:</span> <a class="flex items-center hover:text-white transition-colors duration-200" href="https://music.apple.com/us/album/exiles-letter/1797312533?i=1797312534" target="_blank"><span class="material-icons mr-2">storefront</span>shop</a> <a class="flex items-center hover:text-white transition-colors duration-200" href="https://t.me/inkrealm"><span class="material-icons mr-2">t</span>me</a> <a class="flex items-center hover:text-white transition-colors duration-200" href="https://tidal.com/browse/artist/15916023/u" target="_blank"><span class="material-icons mr-2">music_note</span>2sknygrls</a> </div>
<div class="flex items-center space-x-4">
<a class="social-icon transition-colors duration-300" href="https://twitter.com/inkrealm"><i class="fab fa-twitter"></i></a>
<a class="social-icon transition-colors duration-300" href="https://instagram.com/inkrealm"><i class="fab fa-instagram"></i></a>
<a class="social-icon transition-colors duration-300" href="https://www.tiktok.com/@twoskinnygirls?lang=en"><i class="fab fa-tiktok"></i></a>
</div>
<div class="flex items-center text-center bg-gray-800 bg-opacity-50 p-2 rounded-lg">
<div class="w-24 h-10 mr-2">
<canvas id="timeChart"></canvas>
</div>
<div class="flex flex-col">
<span class="font-mono text-lg" id="clock"></span>
<span class="text-xs text-gray-400">Est</span>
</div>
</div>
     
    
</main>
</div>
<script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><script src="https://cdn.jsdelivr.net/npm/chart.js" type="7a66755cb61411285026116f-text/javascript"></script>
    <script type="7a66755cb61411285026116f-text/javascript">
        document.addEventListener('DOMContentLoaded', function(){
  // tolerant selector list — covers many naming conventions
  const input = document.querySelector(
    '#search-input, .search-input, input[name="q"], input[type="search"], input[type="text"], input[placeholder*="Search"]'
  );
  const btn = document.querySelector('#search-btn, .search-btn, button[type="submit"], button.search');

  function go(q){
    q = (q || '').trim();
    if(!q) return;
    // open in same tab:
    window.location.href = 'https://www.google.com/search?q=' + encodeURIComponent(q) , '_blank';
    // if you prefer a new tab, use:
    // window.open('https://www.google.com/search?q=' + encodeURIComponent(q), '_blank');
  }

  if(input){
    // If input is inside a form, set the form action (non-invasive)
    const form = input.closest('form');
    if(form){
      form.setAttribute('action','https://www.google.com/search');
      form.setAttribute('method','get');
      input.setAttribute('name','q');
    }

    input.addEventListener('keydown', function(e){
      if(e.key === 'Enter'){
        e.preventDefault();
        go(input.value);
      }
    });
  }

  if(btn){
    btn.addEventListener('click', function(e){
      e.preventDefault();
      const q = input ? input.value : '';
      go(q);
    });
  }

  // If neither found, add a global handler for any Enter on the page (safe fallback)
  if(!input && !btn){
    document.addEventListener('keydown', function(e){
      if(e.key === 'Enter'){
        const focused = document.activeElement;
        if(focused && (focused.tagName === 'INPUT' || focused.tagName === 'TEXTAREA')){
          const v = focused.value || '';
          if(v.trim()) go(v);
        }
      }
    });
  }
});
    </script>
<script type="7a66755cb61411285026116f-text/javascript">
        // Make widgets draggable
        function makeDraggable(elmnt, dragHandleSelector) {
            var pos1 = 0,
                pos2 = 0,
                pos3 = 0,
                pos4 = 0;
            const dragHandle = dragHandleSelector ? document.getElementById(elmnt.id).querySelector(dragHandleSelector) : elmnt;
            if (dragHandle) {
                dragHandle.onmousedown = dragMouseDown;
            }
            function dragMouseDown(e) {
                e = e || window.event;
                e.preventDefault();
                pos3 = e.clientX;
                pos4 = e.clientY;
                document.onmouseup = closeDragElement;
                document.onmousemove = elementDrag;
            }
            function elementDrag(e) {
                e = e || window.event;
                e.preventDefault();
                pos1 = pos3 - e.clientX;
                pos2 = pos4 - e.clientY;
                pos3 = e.clientX;
                pos4 = e.clientY;
                elmnt.style.top = (elmnt.offsetTop - pos2) + "px";
                elmnt.style.left = (elmnt.offsetLeft - pos1) + "px";
            }
            function closeDragElement() {
                document.onmouseup = null;
                document.onmousemove = null;
            }
        }
        makeDraggable(document.getElementById("mp3-widget"), '#mp3-header');
        makeDraggable(document.getElementById("video-widget"), '#video-header');
        // Player toggle
        function togglePlayer(type) {
            const player = document.getElementById(`${type}-widget`);
            const icon = document.getElementById(`${type}-icon`);
            if (player.classList.contains('hidden')) {
                player.classList.remove('hidden');
                player.classList.add('flex');
                icon.style.opacity = '0';
                icon.style.pointerEvents = 'none';
            } else {
                player.classList.add('hidden');
                player.classList.remove('flex');
                icon.style.opacity = '1';
                icon.style.pointerEvents = 'auto';
            }
        }
        // Search functionality
        const searchInput = document.getElementById('search-input');
        const searchResultsContainer = document.getElementById('search-results-container');
        const closeSearchResults = document.getElementById('close-search-results');
        const closeIcon = closeSearchResults.querySelector('.material-icons');
        function openSearch() {
            searchResultsContainer.classList.add('expanded');
            closeIcon.textContent = 'expand_less';
        }
        function closeSearch() {
            searchResultsContainer.classList.remove('expanded');
            closeIcon.textContent = 'expand_more';
        }
        searchInput.addEventListener('focus', openSearch);
        searchInput.addEventListener('keypress', function (e) {
            if (e.key === 'Enter') {
                openSearch();
            }
        });
        closeSearchResults.addEventListener('click', () => {
            if (searchResultsContainer.classList.contains('expanded')) {
                closeSearch();
            } else {
                openSearch();
            }
        });
        // Initial state
        document.getElementById('mp3-widget').classList.add('hidden');
        document.getElementById('video-widget').classList.add('hidden');
        closeSearch(); // Initially closed
        // Clock and Time Chart
        const clockElement = document.getElementById('clock');
        const ctx = document.getElementById('timeChart').getContext('2d');
        const timeData = {
            labels: Array(60).fill(''),
            datasets: [{
                label: 'Milliseconds',
                data: Array(60).fill(0),
                backgroundColor: 'rgba(59, 130, 246, 0.2)',
                borderColor: '#3B82F6',
                borderWidth: 1,
                pointRadius: 0,
                tension: 0.4,
                fill: true,
            }]
        };
        const timeChart = new Chart(ctx, {
            type: 'line',
            data: timeData,
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: {
                        beginAtZero: true,
                        max: 1000,
                        ticks: {
                            display: false
                        },
                        grid: {
                            display: false
                        }
                    },
                    x: {
                        ticks: {
                            display: false
                        },
                        grid: {
                            display: false
                        }
                    }
                },
                plugins: {
                    legend: {
                        display: false
                    },
                    tooltip: {
                        enabled: false
                    }
                }
            }
        });
        function updateClock() {
            const now = new Date();
            const hours = String(now.getHours()).padStart(2, '0');
            const minutes = String(now.getMinutes()).padStart(2, '0');
            const seconds = String(now.getSeconds()).padStart(2, '0');
            const milliseconds = now.getMilliseconds();
            clockElement.textContent = `${hours}:${minutes}:${seconds}`;
            // Update chart data
            timeData.datasets[0].data.shift();
            timeData.datasets[0].data.push(milliseconds);
            timeChart.update('none'); // Use 'none' for a smoother animation
            requestAnimationFrame(updateClock);
        }
        updateClock();
        // Ping/Latency simulation
        const pingElement = document.getElementById('ping-latency');
        function updatePing() {
            const basePing = 20;
            const fluctuation = Math.floor(Math.random() * 15) - 7; // -7 to +7
            let newPing = basePing + fluctuation;
            if (Math.random() < 0.05) { // 5% chance of a spike
                newPing += Math.floor(Math.random() * 30);
            }
            pingElement.textContent = `Ping: ${newPing}ms`;
            const statusIndicator = pingElement.previousElementSibling;
            if (newPing > 60) {
                 statusIndicator.classList.remove('bg-green-500', 'bg-yellow-500');
                 statusIndicator.classList.add('bg-red-500');
            } else if(newPing > 40) {
                statusIndicator.classList.remove('bg-green-500', 'bg-red-500');
                statusIndicator.classList.add('bg-yellow-500');
            }
            else {
                statusIndicator.classList.remove('bg-yellow-500', 'bg-red-500');
                statusIndicator.classList.add('bg-green-500');
            }
        }
        setInterval(updatePing, 1500);
        updatePing(); // Initial call
    </script>


    <script src="https://cdn.jsdelivr.net/npm/chart.js" type="7a66755cb61411285026116f-text/javascript"></script>
    <script type="7a66755cb61411285026116f-text/javascript">
        // Enhanced search database
        const searchDatabase = {
            documents: [
                { title: 'Atari 2600 Manual', category: 'Documentation', keywords: ['atari', 'manual', 'gaming', '2600'] },
                { title: 'Coven Artwork - 1991', category: 'Artwork', keywords: ['coven', 'art', '1991', 'design'] },
                { title: 'Project Coven Files (1991)', category: 'Projects', keywords: ['project', 'coven', 'files', '1991'] },
                { title: 'Memo: Atari Partnership', category: 'Business', keywords: ['memo', 'atari', 'partnership', 'business'] },
                { title: 'InkRealm Core Systems', category: 'Technical', keywords: ['inkrealm', 'system', 'core', 'technical'] },
                { title: 'Digital Art Gallery', category: 'Artwork', keywords: ['digital', 'art', 'gallery', 'creative'] },
                { title: 'Collaboration Guidelines', category: 'Documentation', keywords: ['collaboration', 'guidelines', 'team', 'work'] },
                { title: 'Resource Management', category: 'Technical', keywords: ['resource', 'management', 'system', 'tools'] },
                { title: 'WordStar Configuration', category: 'Configuration', keywords: ['wordstar', 'config', 'setup', 'system'] }
            ],
            sections: [
                { title: 'Lore Section', category: 'Navigation', keywords: ['lore', 'history', 'story', 'background'] },
                { title: 'Collaborations Hub', category: 'Navigation', keywords: ['collaborations', 'team', 'projects', 'work'] },
                { title: 'Resources Center', category: 'Navigation', keywords: ['resources', 'tools', 'documentation'] },
                { title: 'Processor App', category: 'Navigation', keywords: ['processor', 'application', 'tools'] }
            ]
        };

        // Search functionality with debouncing
        let searchTimeout;
        const searchInput = document.getElementById('search-input');
        const searchResultsContainer = document.getElementById('search-results-container');
        const searchResultsList = document.getElementById('search-results-list');
        const searchLoading = document.getElementById('search-loading');
        const closeSearchResults = document.getElementById('close-search-results');

        function performSearch(query) {
            if (!query.trim()) {
                closeSearch();
                return;
            }

            searchLoading.classList.remove('hidden');
            
            // Simulate search delay
            setTimeout(() => {
                const results = [];
                const queryLower = query.toLowerCase();

                // Search documents
                searchDatabase.documents.forEach(doc => {
                    if (doc.title.toLowerCase().includes(queryLower) || 
                        doc.keywords.some(keyword => keyword.includes(queryLower))) {
                        results.push(doc);
                    }
                });

                // Search sections
                searchDatabase.sections.forEach(section => {
                    if (section.title.toLowerCase().includes(queryLower) || 
                        section.keywords.some(keyword => keyword.includes(queryLower))) {
                        results.push(section);
                    }
                });

                displaySearchResults(results, query);
                searchLoading.classList.add('hidden');
            }, 300);
        }

        function displaySearchResults(results, query) {
            searchResultsList.innerHTML = '';

            if (results.length === 0) {
                searchResultsList.innerHTML = `
                    <div class="text-center py-8 text-gray-400">
                        <span class="text-4xl block mb-2">🔍</span>
                        <p>No results found for "${query}"</p>
                        <p class="text-sm mt-2">Try different keywords or check spelling</p>
                    </div>
                `;
            } else {
                results.forEach(result => {
                    const resultElement = document.createElement('div');
                    resultElement.className = 'search-item cursor-pointer';
                    resultElement.innerHTML = `
                        <div class="flex justify-between items-center">
                            <div>
                                <h3 class="text-blue-400 hover:text-blue-300 font-medium">${result.title}</h3>
                                <p class="text-xs text-gray-500 search-category">${result.category}</p>
                            </div>
                            <span class="text-gray-500">→</span>
                        </div>
                    `;
                    resultElement.addEventListener('click', () => {
                        if (result.category === 'Navigation') {
                            const section = result.title.toLowerCase().split(' ')[0];
                            showSection(section);
                        }
                        closeSearch();
                    });
                    searchResultsList.appendChild(resultElement);
                });
            }

            openSearch();
        }

        function openSearch() {
            searchResultsContainer.classList.add('expanded');
            closeSearchResults.querySelector('.icon-expand').textContent = '⌃';
        }

        function closeSearch() {
            searchResultsContainer.classList.remove('expanded');
            closeSearchResults.querySelector('.icon-expand').textContent = '⌄';
        }

        // Search event listeners
        searchInput.addEventListener('input', (e) => {
            clearTimeout(searchTimeout);
            searchTimeout = setTimeout(() => {
                performSearch(e.target.value);
            }, 300);
        });

        searchInput.addEventListener('focus', () => {
            if (searchInput.value.trim()) {
                openSearch();
            }
        });

        closeSearchResults.addEventListener('click', () => {
            if (searchResultsContainer.classList.contains('expanded')) {
                closeSearch();
            } else if (searchInput.value.trim()) {
                openSearch();
            }
        });

        // Server switching functionality
        const serverDropdown = document.getElementById('server-dropdown');
        const currentServerSpan = document.getElementById('current-server');
        const serverOptions = document.querySelectorAll('.server-option');

        serverOptions.forEach(option => {
            option.addEventListener('click', (e) => {
                e.preventDefault();
                const newServer = e.currentTarget.getAttribute('data-server');
                currentServerSpan.textContent = newServer;
                
                // Simulate server switch with ping update
                updatePingForServer(newServer);
            });
        });

        function updatePingForServer(server) {
            const pingRanges = {
                'wordstar.nexus': [20, 35],
                'birch.node': [45, 60],
                'dreamweaver.sys': [30, 50],
                'eisernekuh.net': [60, 90],
                'ai.nexus': [15, 25]
            };
            
            const range = pingRanges[server] || [20, 50];
            const ping = Math.floor(Math.random() * (range[1] - range[0] + 1)) + range[0];
            document.getElementById('ping-latency').textContent = `Ping: ${ping}ms`;
        }

        // Navigation functionality
        function showSection(sectionName) {
            const welcomeMessage = document.getElementById('welcome-message');
            welcomeMessage.style.display = 'none';
            
            // You can add specific section content here
            console.log(`Navigating to section: ${sectionName}`);
            
            // Update system status
            document.getElementById('system-status').textContent = `Status: Viewing ${sectionName}`;
        }

        // Media player functionality
        function togglePlayer(type) {
            const player = document.getElementById(`${type}-widget`);
            const icon = document.getElementById(`${type}-icon`);
            
            if (player.classList.contains('hidden')) {
                player.classList.remove('hidden');
                player.classList.add('flex');
                icon.style.opacity = '0.3';
            } else {
                player.classList.add('hidden');
                player.classList.remove('flex');
                icon.style.opacity = '1';
            }
        }

        // Make widgets draggable
        function makeDraggable(element) {
            let pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;
            const header = element.querySelector('[id$="-header"]');
            
            if (header) {
                header.onmousedown = dragMouseDown;
            }

            function dragMouseDown(e) {
                e = e || window.event;
                e.preventDefault();
                pos3 = e.clientX;
                pos4 = e.clientY;
                document.onmouseup = closeDragElement;
                document.onmousemove = elementDrag;
            }

            function elementDrag(e) {
                e = e || window.event;
                e.preventDefault();
                pos1 = pos3 - e.clientX;
                pos2 = pos4 - e.clientY;
                pos3 = e.clientX;
                pos4 = e.clientY;
                element.style.top = (element.offsetTop - pos2) + "px";
                element.style.left = (element.offsetLeft - pos1) + "px";
            }

            function closeDragElement() {
                document.onmouseup = null;
                document.onmousemove = null;
            }
        }

        // Initialize draggable widgets
        makeDraggable(document.getElementById('mp3-widget'));
        makeDraggable(document.getElementById('video-widget'));

        // Add click handlers for widget close buttons
        document.querySelectorAll('.icon-close').forEach(closeBtn => {
            closeBtn.addEventListener('click', (e) => {
                const widget = e.target.closest('[id$="-widget"]');
                if (widget) {
                    const widgetType = widget.id.replace('-widget', '');
                    togglePlayer(widgetType);
                }
            });
        });

        // Add click handlers for desktop icons
        document.getElementById('mp3-icon').addEventListener('click', () => togglePlayer('mp3'));
        document.getElementById('video-icon').addEventListener('click', () => togglePlayer('video'));

        // Add click handlers for navigation items
        document.querySelectorAll('.nav-item').forEach(navItem => {
            navItem.addEventListener('click', (e) => {
                e.preventDefault();
                const section = e.currentTarget.getAttribute('data-section');
                if (section) {
                    showSection(section);
                }
            });
        });

        // Clock and system monitoring
        const clockElement = document.getElementById('clock');
        const cpuUsageElement = document.getElementById('cpu-usage');
        const cpuBarElement = document.getElementById('cpu-bar');
        const memUsageElement = document.getElementById('mem-usage');
        const memBarElement = document.getElementById('mem-bar');

        function updateSystemStats() {
            const now = new Date();
            const timeString = now.toLocaleTimeString([], { hour12: false });
            clockElement.textContent = timeString;

            // Simulate CPU usage fluctuation
            const baseCpu = 20;
            const cpuFluctuation = Math.floor(Math.random() * 30);
            const newCpu = Math.min(100, baseCpu + cpuFluctuation);
            cpuUsageElement.textContent = `${newCpu}%`;
            cpuBarElement.style.width = `${newCpu}%`;

            // Simulate memory usage
            const baseMem = 60;
            const memFluctuation = Math.floor(Math.random() * 20) - 10;
            const newMem = Math.max(30, Math.min(100, baseMem + memFluctuation));
            memUsageElement.textContent = `${newMem}%`;
            memBarElement.style.width = `${newMem}%`;
        }


        // Ping simulation
        function updatePing() {
            const currentServer = document.getElementById('current-server').textContent;
            updatePingForServer(currentServer);
        }

        // Initialize canvas chart
        const canvas = document.getElementById('timeChart');
        const ctx = canvas.getContext('2d');
        let chartData = Array(20).fill(0).map(() => Math.random() * 40 + 10);

        function drawChart() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            ctx.strokeStyle = '#3B82F6';
            ctx.lineWidth = 1;
            ctx.beginPath();
            
            const step = canvas.width / (chartData.length - 1);
            chartData.forEach((value, index) => {
                const x = index * step;
                const y = canvas.height - (value / 50 * canvas.height);
                
                if (index === 0) {
                    ctx.moveTo(x, y);
                } else {
                    ctx.lineTo(x, y);
                }
            });
            
            ctx.stroke();
            
            // Update data
            chartData.shift();
            chartData.push(Math.random() * 40 + 10);
        }

        // Start all intervals
        setInterval(updateSystemStats, 1000);
        setInterval(updatePing, 2000);
        setInterval(drawChart, 100);
        createMatrixRain();

        // Initial calls
        updateSystemStats();
        updatePing();
        drawChart();
        closeSearch();

        // Add some startup messages
        setTimeout(() => {
            console.log('🚀 InkRealm systems online');
            console.log('🔗 Connected to wordstar.nexus');
            console.log('📡 All subsystems operational');
        }, 1000);
    </script>

<script src="/cdn-cgi/scripts/7d0fa10a/cloudflare-static/rocket-loader.min.js" data-cf-settings="7a66755cb61411285026116f-|49" defer></script></body>
</html>