Editing Main Page

<style>
/* SYSTEM FONT FOR MAIN PAGE */
body {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
               Roboto, Helvetica, Arial, sans-serif;
  margin: 0;
  padding: 0;
}

/* LIGHT MODE (default) */
.mainpage-container {
  background-color: #fff;
  color: #222;
  padding: 20px;
  font-size: 16px;
  max-width: 1100px;
  margin: auto;
  font-weight: normal;
}

.mainpage-container h1 {
  font-size: 2.4em;
  color: #009933;
  text-align: center;
  margin-bottom: 0.2em;
}

.mainpage-container h2 {
  color: #006600;
  margin-top: 0;
}

.mainpage-container a {
  color: #006600;
  text-decoration: none;
}

.mainpage-container a:hover,
.mainpage-container a:focus {
  color: #009900;
  text-decoration: underline;
}

.mainpage-container .section-box {
  background-color: #f9f9f9;
  border: 1px solid #ccc;
  border-radius: 10px;
  padding: 15px;
  margin: 10px;
  flex: 1 1 300px;
  box-sizing: border-box;
}

.mainpage-container .sections-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 30px;
}

/* DARK MODE OVERRIDE */
@media (prefers-color-scheme: dark) {
  .mainpage-container {
    background-color: #121212;
    color: #e0e0e0;
  }
  
  .mainpage-container h1 {
    color: #66ff66;
  }
  
  .mainpage-container h2 {
    color: #33aa33;
  }
  
  .mainpage-container a {
    color: #66ff66;
  }
  
  .mainpage-container a:hover,
  .mainpage-container a:focus {
    color: #99ff99;
    text-decoration: underline;
  }
  
  .mainpage-container .section-box {
    background-color: #1e1e1e;
    border-color: #333;
  }
}
</style>

<div class="mainpage-container">

  <h1>Welcome to the Official School Wiki</h1>
  <p style="text-align:center; font-size:1.2em; margin-top:-0.5em; margin-bottom:1.5em;">
    The place where chaos, legend, and cafeteria disasters are immortalized.
  </p>

  <div class="sections-wrapper">

    <div class="section-box">
      <h2>🏫 About the School</h2>
      <p>Everything from when the school was founded to that one time a goat entered the lab.</p>
      <ul>
        <li>[[History of the School]]</li>
        <li>[[Campus Map]]</li>
        <li>[[Departments and Blocks]]</li>
      </ul>
    </div>

    <div class="section-box">
      <h2>🧑‍🏫 Legendary Teachers</h2>
      <p>The icons, the rage-quitters, the ones who gave "pop quiz" its true meaning.</p>
      <ul>
        <li>[[Sir Rahman's 5 Rules of Physics]]</li>
        <li>[[Most Quoted Teachers]]</li>
        <li>[[Hall of Fame]]</li>
      </ul>
    </div>

    <div class="section-box">
      <h2>🎓 Notable Students</h2>
      <p>The pranksters, the toppers, and that one dude who spilled biryani in the lab.</p>
      <ul>
        <li>[[Batch of 2025]]</li>
        <li>[[Class Clown Chronicles]]</li>
        <li>[[Student Court Cases]]</li>
      </ul>
    </div>

    <div class="section-box">
      <h2>🏗️ Around the School</h2>
      <p>Desks with graffiti, hidden staircases, and the Room That Shall Not Be Named™.</p>
      <ul>
        <li>[[The Cursed Toilet]]</li>
        <li>[[Places Students Hide During Assembly]]</li>
        <li>[[WiFi Dead Zones]]</li>
      </ul>
    </div>

    <div class="section-box">
      <h2>📅 Timeline of Events</h2>
      <p>The ultimate yearbook of chaos. From fire drills to frozen ACs.</p>
      <ul>
        <li>[[2022 Events]]</li>
        <li>[[2023 Highlights]]</li>
        <li>[[Funniest Incidents Ever]]</li>
      </ul>
    </div>

  </div>

  <div style="text-align:center; font-size: 0.9em; margin-top: 40px; color: #888;">
    Maintained by students. Fueled by memory. Powered by WiFi that barely works.
  </div>
</div>