<!--
   ____  _    _   _   _  ____  _  
  / __ \| |  | | | \ | |/ __ \| | 
 | |  | | |__| | |  \| | |  | | | 
 | |  | |  __  | | . ` | |  | | | 
 | |__| | |  | | | |\  | |__| |_| 
  \____/|_|  |_| |_| \_|\____/(_) my source code ... >_<...
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⡠⢔⣦⣶⣿⣿⣿⣿⡷⠖⠒⠀⠀⠀⠀⠀⠀⠀⠀⣀⠀⠉⠁⠂⠀⠀⢀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⣰⠶⣦⡤⣄⠀⠀⠀⠀⠀⠀⣠⠖⢩⣶⣿⣿⣿⣿⣿⠟⢉⣠⠔⠊⠁⠀⠀⠀⣀⣄⠀⠀⠉⠑⢦⣠⣤⣤⡀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠘⢷⣌⡧⡾⠀⠀⠀⠀⡠⠊⢁⣴⣿⣿⣿⣿⣿⢟⣠⡾⠟⠁⠀⣀⣤⣶⠞⣫⠟⠁⠀⢀⠄⠀⢀⠙⢿⣿⣿⣷⣄
⠀⠀⠀⠀⢠⠀⠀⠀⠀⠀⠉⠉⠁⠀⠀⣠⣾⣶⣶⣿⣿⣿⣿⣿⣿⣷⡿⠋⣀⣤⣶⣿⣿⣋⣴⡞⠁⠀⠀⣠⠊⠀⠀⢸⡄⢨⣿⣿⣿⣿
⠀⠀⠀⠀⠀⢃⠀⠀⠀⠀⠀⠀⠀⠀⣼⣿⣿⣿⠿⠿⢻⣿⣿⣿⣿⣿⣿⠿⠛⢉⣴⣿⢿⣿⠏⠀⠀⠀⡴⠃⣰⢀⠀⢸⣿⣤⣏⢻⣿⣿
⠀⠀⠀⠀⠀⠘⡆⠀⠀⠀⠀⠀⢀⣾⡿⣿⡿⠁⠀⢀⣾⣿⣿⣿⡿⠋⠁⠀⣠⣿⠟⢡⣿⡟⠀⢀⣤⣾⠁⣼⣿⢸⡇⢸⣿⣿⣿⡈⣿⣿
⠀⠀⠀⠀⠀⠀⡇⠀⠀⠀⠀⢀⣾⠋⣼⣿⠁⢀⠀⣼⣿⣿⠟⠁⠀⠀⠀⣰⡿⠋⢠⣿⡿⠁⢠⣾⣿⡏⢀⣿⣿⣾⣿⢸⣿⣿⣿⡇⢹⣿
⠀⠀⠀⢰⡶⣤⣤⣄⠀⠀⠀⡼⠁⣼⣿⣿⣾⣿⣰⣿⠟⠁⠀⠀⠀⠀⢠⡿⠁⠀⣾⣿⠃⢠⣿⢿⡿⠁⠸⢿⣿⣿⣿⣿⣿⣿⣿⣿⠸⣿
⠀⠀⠀⠘⣧⣈⣷⡟⠀⠀⣰⠁⡼⢻⣿⣿⣿⣿⡿⠋⠀⠀⠂⠒⠒⠒⣾⠋⠀⢠⣿⡏⢠⣿⢃⡿⠁⠀⠀⢸⣿⣿⣿⣿⣿⣿⣿⣿⠀⣿
⠀⠀⠀⠀⠈⠉⠁⠀⠀⢠⠇⣰⠁⠸⣹⣿⣿⠟⠀⠀⠀⠀⠀⠀⠀⠐⡇⠀⠀⢸⣿⢃⣿⠋⣿⡀⠀⠀⠀⠈⣿⣿⣿⣿⣿⣿⣿⣿⠀⡇
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠘⣰⠃⡀⢀⣿⣿⡏⢘⣶⣶⣶⣷⣒⣄⠀⠀⠀⠀⠀⠸⣿⣾⠃⠰⠁⠙⢦⡀⠀⠀⢹⣿⣿⣿⣿⣿⣿⣿⢠⡇
⠀⠀⠀⠀⠀⠀⠀⠀⠀⡔⢁⠞⢁⣾⣿⣿⣷⠟⠁⣠⣾⣿⣿⣧⠀⠀⠀⠀⠀⠀⣿⡏⠀⠀⠀⠀⠀⠙⢦⡀⠀⢿⣿⣿⣿⣿⣿⣿⣸⠃
⠀⠀⠀⠀⠀⠀⠀⣠⣾⡖⠁⣠⣾⣿⣿⣿⡏⠀⢰⠿⢿⣿⣯⣼⠁⠀⠀⠀⠀⠀⠹⠀⠀⠀⠀⠀⠀⠀⠀⠈⠢⢬⣿⣿⡘⣿⣿⣏⣿⠀
⠀⠀⠀⠀⠀⣠⣾⢟⠋⣠⣾⣿⡿⠋⢿⣿⠀⠀⢼⠀⠀⢀⣿⣿⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣙⣷⣴⣆⡀⠀⠀⠈⢿⣧⠸⣿⣿⣿⣿
⠀⠀⢀⡤⠞⢋⣴⣯⣾⡿⠟⠋⠀⠀⢸⣿⡆⠀⠸⡀⠉⢉⡼⠃⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣰⣿⣿⣿⣿⣿⣶⣆⠀⠈⢿⣧⠹⣿⣿⣿
⠀⠀⠀⣸⣶⣿⣿⠟⠋⠀⠀⠀⠀⣴⡎⠈⠻⡀⠈⠛⠋⠉⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢰⠿⠛⠛⠻⣿⣬⡏⠻⣷⡀⠈⢻⣿⣿⣿⣿
⢂⣠⣴⣿⡿⢋⣼⣿⣿⣿⣿⣿⠋⢹⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠺⡄⠀⠀⢀⡾⣿⠁⠀⢹⡇⠀⢠⣿⣿⣿⣿
⣿⣿⣽⣯⣴⣿⣿⠿⡿⠟⠛⢻⡤⠚⠢⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠸⡇⠈⠉⢉⡴⠃⠀⠀⢸⠇⢠⣿⣿⣿⣿⣿
⣿⡇⣿⠿⣯⡀⠀⠀⠈⣦⡴⠋⠀⠀⢀⠨⠓⠤⡀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⠻⠷⠒⠋⠀⠀⠀⠀⠃⣴⣿⠿⣡⣿⠏⠀
⠁⠀⠃⠀⠈⠳⣤⠴⡻⠋⠀⢀⡠⠊⠁⠀⠀⢀⡽⢄⠀⠘⡄⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣴⣾⣿⠏⣺⠟⠁⠀⠀
⠀⠀⠀⠀⠀⡰⠋⢰⠁⠀⠀⠀⠀⠀⣀⠤⠊⠁⠀⠀⢱⡀⠘⢆⡀⣀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠠⠖⠛⠛⢉⣤⠞⠁⠀⠀⠀⠀
⠀⠀⠀⠀⡜⠁⠀⠈⢢⡀⠀⠀⠀⠀⠁⠀⠀⠀⣀⠔⠋⢱⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣠⡞⠉⠀⠀⠀⣀⠀⠀⠈
⠀⠀⠀⡜⠀⠀⠀⠀⢰⠑⢄⠀⠀⠀⠀⠀⠀⠊⠀⢀⣀⢀⠇⠀⡠⠒⠒⢶⠈⠉⠑⡖⠈⠓⢢⠤⢄⣀⣴⣾⣏⠉⠛⠋⠉⠉⠀⠀⠀⢠
⠀⠀⠀⠀⠀⠀⠀⠀⢸⠀⠀⠑⣄⡀⠀⠀⠀⠀⠀⠀⣹⡿⢤⣼⠃⠀⠀⢸⠀⠀⠀⡇⠀⠀⢸⠀⠀⠈⣿⣿⣿⣦⣀⣀⣀⣀⣀⣶⢶⣿
⠀⠀⠀⠀⠀⣠⠔⠒⢻⠀⠀⠀⠃⠉⠒⠤⣀⡀⠤⠚⠁⣇⡰⠿⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠌⠀⠀⣰⠟⠋⠁⠀⠀⠀⠀⠈⠉⠛⠦⡻
⠀⠀⠀⠀⠀⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⣼⡏⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢠⠃⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈
⠀⠀⠀⠀⠀⠀⠀⠀⠑⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⠃⠹⣄⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢠⠃⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠚⠀⠀⠈⠓⠤⣀⡀⠀⠀⠀⠀⠀⢀⣠⠔⠁⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀
⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⠈⠉⠉⠉⠉⠉⡁⠀⠀⠀

 Look away!!!!!! It's jank in here!!!!!!!! The pretty pinks do  not reveal the
 sheer monstrosities hidden !!!!!!!!

 Just kidding. Feel free to steal crapIdunno . If heavily inspod credit or telling me is appreciated but I don careee>_< Have fun .... 
 Carry ur magical staff in here with you. its scary
--><!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>a magical girl's digital palace!</title>
  <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
  <div class="container">
          <div id = "deco1"><img src = "lacebg.png"></div>
          <div id = "deco2"><img src = "lacebg.png"></div>
          <div id = "deco3"><img src = "switchframe.png"><!-- Thank u monsieur doll for the inspo on the switch and for the tutorial on the hues/filters... --></div>
          <div id = "switchbutton"><img style = "width:75px"src="switchbutton.png" onclick="nextYT()" style="cursor: pointer; width: 100px;" alt="Next Video">
</div>
          <div id = "bannerdeco"><img src = "meow.png"></div>
          <div id = "flyingchiikawa"><img src = "chiikawa2.png"></div>
          <div id = "flyingchiikawa2"><img src = "chiikawa3.png"></div>
          <div id = "heartbubble"><img src = "heart.png"></div>
          <div id = "myvideo"><div id = "pinkvidoverlay"><img src="pinkcolor.webp"></div><iframe id="ytPlayer"
  src="https://www.youtube.com/embed/3xId-Yh_JHA?autoplay=1&mute=1&controls=0&rel=0"
  allowfullscreen>
</iframe>
</div>

    <header>
      <div class = "mainbanner"><div id = "maintext"><h1 id="bannertext">インターネト魔法</h1></div></div>
      <marquee behavior="scroll" direction="left" scrollamount = "12">Welcome to my site~!! Feel free to look around (≧◡≦) ♡</marquee>
      <div class = "undermarquee">netmagicalgirl.neocities.org is under construction! <div>

    </header>

      <div class = "row-one">
        <img id = "borderbow" src="blackbow.png">
        <img id = "borderbow2" src="blackbow.png">
        <div id="nav">
          <div class = "titlestyle"><p>navigation</p></div>


          <div id = hey2>

          <div class = "navlink"> 
            <img class = "heartbutton" src ="heartbutton.jpg">
            <a href="aboutme.html">about me</a>
          </div>
          <div class = "navlink">
            <img class = "heartbutton" src ="heartbutton.jpg">
            <a href = "missing.html">sitemap</a>
          </div>
          <div class = "navlink">
            <img class = "heartbutton" src ="heartbutton.jpg">
            <a href = "blog.html">blog</a>
          </div>
          <div class = "navlink">
            <img class = "heartbutton" src ="heartbutton.jpg">
            <a href ="https://netmagicalgirl.atabook.org/">guestbook</a>
          </div>
        

        </div>
        <div><img style = "width:180px"src = "plushbaby.jpg"></div>
                  <div class = "titlestyle"><p>fun stuff</p></div>

                  <div id = hey2>

          <div class = "navlink"> 
            <img class = "heartbutton" src ="heartbutton.jpg">
            <a href = "missing.html">kamurocho</a>
          </div>
          <div class = "navlink">
            <img class = "heartbutton" src ="heartbutton.jpg">
            <a href = "missing.html">J-fashion blog</a>
          </div>
          <div class = "navlink">
            <img class = "heartbutton" src ="heartbutton.jpg">
            <a href = "missing.html">OC library</a>
          </div>
          <div class = "navlink">
            <img class = "heartbutton" src ="heartbutton.jpg">
            <a href = "missing.html">art gallery</a>
          </div>
        
        </div>
        <div class = "titlestyle"><p>projects...</p></div>
          </div>

        
        <div id="box">
          <div class = "welcomewelcome"> 
            <h3 id  = "meowmeow"> Welcome to my digital palace ~ </h3>
          
          </div>
          <div id ="welcometext">
            <img class = "welcomeimage" src = "nerdchiikawa.jpg">
            <p> <span style="color: #e0adc0d2"><b>You made it ! Yippee ! !! !</b></span><br> This site is for all my fellow cyber-sorcerers and magical girls working overtime! ! You can stay here as long as you like . . . I'm sure all that websurfing's got you exhausted, huh? ^_^ Come in, come in !!! My firewalls are warm, my cache is cozy, and my cookies are totally homemade, trust me..</p>
                    <hr>
            <div class = "pleaseread">
              <p> <b>WARNING !!</b>This site isn't optimized for mobile and probably never will be..!! Computers rule!!! Best experienced on Chrome or Microsoft Edge. </p>
              <hr>
              <p> Oh, just before you start exploring... (˶˃ ᗜ ˂˶)<br><br>
              
              Initializing transformation protocols..<br><br>Preparing the perfect magical outfit...<br><img src = "lolitadress.webp"><br> Calling over your trusty sidekick...<br><br>Don't forget your wand! <br><br>. ݁₊ ⊹ . ݁ ⟡ ݁ . ⊹ ₊ ݁.<br> Output: Transformation Protocol complete!<br>Enjoy your jounrey through my sparkly web haven ~<br>ଘ(∩^o^)⊃━☆:･ﾟ✧*:･ﾟ✧✯</p><br>
              
            </div>
          </div>
        <marquee id = "buttonscroll" behavior="scroll" direction="left" scrollamount = "12">๑(° W°"๑)FIRST EVER VERSION IS OUT!!!!!!! AHHHHHHH๑(° Д°"๑)๑(° Д°"๑) so nervous... SO EXCITED! </marquee>
        </div>
        <div id = right1>
        <div class = "right">
          <div class = "titlestyle">Add my button!</div>
                     <a href="https://netmagicalgirl.neocities.org/" target="_blank"><img id = "button" src="https://files.catbox.moe/ebaoq9.png"></a>
                     
                             <div class = "cliques">
          <p>Link my button! Here's the code:<br>
          &lt;a href="https://netmagicalgirl.neocities.org/" target="_blank"&gt;&lt;img id = "button" src="https://files.catbox.moe/ebaoq9.png"&gt;&lt;/a&gt;&lt;/p&gt;</p>
        </div>


        </div>
        <div class = "right2">
          <div class = "titlestyle">Status:3</div>

          <div class = "scrolly">
            <img id = "bowdivider" src = "pinkdivider.png">
            <img style = "width:150px" src = "lalala.png">
<div id="statuscafe"><div id="statuscafe-username"></div><div id="statuscafe-content"></div></div><script src="https://status.cafe/current-status.js?name=netmagicalgirl" defer></script>
          </div>
        </div>
        </div>
      </div>

      <marquee id = "buttonmarquee" behavior="scroll" direction="left" scrollamount = "12">Rinnie loves you&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Today's spell: Believe in yourself! It's super effective!&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;What will you conquer on this magical day?&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Fyi: Click on the glowing paw on the Switch ദ്ദി(｡•̀ ,&lt;)~✩‧₊&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Take care of yourself!</marquee>

      <div class="row-three">
      <div class = "middle"> 
        <div>
                  <div class ="lacetext">
            <p> </p>
         <img style = "width:300px" src = "memmeme.png">
         <br>
            <p> <span style="color: #e292be"><b>netmagicalgirl.neocities.org</b></span> is my first ever big coding project  >_> so sorry if some things are ...interesting !!! !<br><br> i started web dev seriously a couple months ago and i feel like the evolution of this site is a nice way to document my progress:3 its also generally a space and digital journal for me to yapp about the things i love oh so much and <span style="color: #e292be">interact with fellow creatives ^_^ !</span><br> i feel like the internet has become ... ( ; _ ;) so heavy lately. everywhere is soulless and sort of a hellscape (keyword: sort of) and that's part of why the indie web resonates so much with me! ^_^ im a big fan of just being able to be silly and express myself, and this project and the whole <span style="color: #e292be"><i>internet magical girl</i> persona </span>is how i achieve such... <br> i hope you have fun visiting and this site brings a smile to your face or inspires you ~ Thanks for taking the time out of your day to check it out. Sending a digital love spell to you (∩◕ᗜ◕)⊃━☆ﾟ.* 

</p>
          </div>
          </div>
      </div>
      <div class = "middle2">
                  <div class = "welcomewelcome"> 
            <h3 id  = "meowmeow" style = "height:50px"> Neighbors, Cliques, and Webrings ~ </h3>
          </div>
        <div class = "cliques">
          <p>Here are some other personal sites that have inspired me/I'm net neighbors with/I find awesome!!!!</p>
          <div id = "coolio">
<a href="https://goooby.neocities.org/" target="_blank"><img width="81px" height="33px" src="goooby88x31new.png"></a>
 <a href="https://lolv66.neocities.org" target="_blank">
  <img width="81px" height="33px" src="button.gif" alt="lolv66's site">
</a>
<a href="https://lovesick.cafe/" target="_blank"><img width="81px" height="33px" src="lovesick-88x31-1.png"></a>
<a href="https://nyaa.neocities.org"><img src="https://nyaa.neocities.org/nyaabanner.gif"></a>
<a href="https://monsieurdoll.neocities.org" target="_blank"><img src="monsieurdoll.png"></a><br>
<a href="https://burgeritchi.neocities.org" target="_blank"><img src="https://files.catbox.moe/29hdqz.webp" width="88" height="31"></a>
<p>No webrings yet... I'M WORKING ON IT!!!!!</p>
                    

          </div>
        </div>
      </div>
             <img id = "boxcurtain" src="bowdivider.png">
      </div>

            <div class = "row-two">
        <!--<img id = "borderbow" src="blackbow.png">
        <img id = "borderbow2" src="blackbow.png">-->

        <div id="commentbox">
          <div class = "titlestyle">Chatbox</div>
          <iframe src="https://www5.cbox.ws/box/?boxid=957034&boxtag=Q4udar" width="100%" height="450" allowtransparency="yes" allow="autoplay" frameborder="0" marginheight="0" marginwidth="0" scrolling="auto"></iframe>	
          
          </div>

        
        <div id="box2">

                    <h3 class = "title" style = "height:10px"> Art Gallery </h3> <br>
                    <div class = "galleryimages">
                      <img src = "heartbaby2.png">
                      <img src = "heartbabyyay.png">
                      <img src = "heartbaby.png">
<p> I love love love drawing fanart and art of my OC's! Here's my latest pieces... Check out more at the <a>art gallery</a> ~</p>
                    </div>
        </div>
        <div id = "rightnow">
          <div class = "titlestyle"><p>updates</p></div>
          <div id = "hey3">
          
          
          <p class = "title">June 3rd<br>2025</p>
        
        <p> WOAH WOAH WOAH WOAH!!!!!<br>
        
        netmagicalgirl.
        neocities.org is OFFICIALLY ONLINE!!!!!!<br><br> My life's goal is complete... Jk... This website is anything but complete. But the basics are there! I've spent a lot of time on This
      already but I have so many more ideas and IC ANNOT WAIT !!!!!!! ! YAHOOO! <br><br>
    Anyways. I completely overlooked the size of this update bar. It is SOOOO tiny. Nothing is readable! Oh well...</p>
    <hr>
        
        
        </div>
        </div>

        <div id = "capitalism">

        </div>
      </div>



    <footer>
      <p>© 2025 netmagicalgirl | Hosted with love on Neocities ☆彡</p>
    </footer>
  </div>
  <script>
  const ytLinks = [
    'L3tsYC5OYhQ', 
    'nZuNMb57rVI', 
    'WPID2tnbFeM'  
  ];

  let i = 0;

  function nextYT() {
    i = (i + 1) % ytLinks.length;
    document.getElementById('ytPlayer').src = 'https://www.youtube.com/embed/' + ytLinks[i]+'?autoplay=1&mute=1&controls=1&rel=0';
  }
</script>




</body>


</html>