import { Video } from "@/tags/Video.tsx";
export default () => (
  <main class="waterfalls">
    <div class="waterfalls_bg1" />
    <main class="waterfalls">
      <div class="contain">
        <h1>waterfalls and gender identity update</h1>
        <p>
          this is a song about identity, jealousness, and the seasons. more
          specifically, it's a personal account of how it felt realizing i was a
          transgender woman. enjoy.
        </p>
      </div>
      <Video
        title={
          <>
            <strong>music video</strong>: waterfalls
          </>
        }
        width={1920}
        height={1080}
        poster="/file/2025/waterfalls/thumbnail.jpeg"
        posterHash="hMM%+pl^]eOvxCXU$$Ew4TB~LceBsAacSiOq3*F;MevmthFf+]$*WM]%E2KybarEt7NIJ3K$J8r=igxbTERP"
        sources={[
          "/file/2025/waterfalls/stream/hls.m3u8",
          "/file/2025/waterfalls/waterfalls.webm",
        ]}
        downloads={[
          "/file/2025/waterfalls/waterfalls.mp3",
          "/file/2025/waterfalls/waterfalls.mp4",
          "/file/2025/waterfalls/waterfalls.webm",
          "/file/2025/waterfalls/lyrics.txt",
          "/file/2025/waterfalls/",
        ]}
      />
      <div class="contain">
        <p>
          it's nice to be <em>free</em>.
        </p>
        <p>like paper airplanes in the wind.</p>
        <p>the stars shine in the sky. it's beautiful.</p>
        <p>
          love
          <br />
          –clover caruso
        </p>
        <br />

        <p>
          <strong>more</strong>: <br />
          <a href="/file/2025/waterfalls/fragments">fragments</a>
          <br />
          <a href="/q+a">q&a page</a>
        </p>
      </div>
    </main>
  </main>
);

export const theme = {
  fg: "#fff",
  bg: "#000",
};