releases/site/releases.html

<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>다운로드 - MEDIABROWSER</title>
<meta name="description" content="MEDIABROWSER 공식 릴리스 다운로드. Windows 네이티브 설치자, macOS·Linux 프리뷰 빌드, Android 컴패니언 APK.">
<meta property="og:type" content="website">
<meta property="og:title" content="다운로드 - MEDIABROWSER">
<meta property="og:description" content="플랫폼별 최신 릴리스를 내려받으세요. Windows 설치자, macOS·Linux 프리뷰, Android 컴패니언 APK.">
<meta property="og:url" content="https://mediabrowser-7r4.pages.dev/releases.html">
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><rect width='100' height='100' rx='24' fill='%233b82f6'/><path d='M50 22v36M36 44l14 14 14-14M28 74h44' stroke='white' stroke-width='9' stroke-linecap='round' stroke-linejoin='round' fill='none'/></svg>">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/wanteddev/wanted-sans@v1.0.3/packages/wanted-sans/fonts/webfonts/variable/split/WantedSansVariable.min.css">
<link rel="stylesheet" href="styles.css">
</head>
<body>

<div class="ambient-lighting" aria-hidden="true">
  <div class="ambient-spotlight"></div>
  <div class="ambient-grid"></div>
</div>

<!-- Fluid Island Navigation -->
<div class="nav-wrapper">
  <nav class="nav glass" aria-label="주 메뉴">
    <a class="nav__brand" href="index.html">
      <span class="nav__logo-badge">
        <svg class="icon" aria-hidden="true"><use href="assets/icons.svg#download-simple"/></svg>
      </span>
      <span>MEDIABROWSER</span>
    </a>
    <div class="nav__links">
      <a class="nav__link" href="index.html#how-it-works">작동 방식</a>
      <a class="nav__link" href="index.html#features">핵심 기능</a>
      <a class="nav__link" href="index.html#mobile">모바일 연결</a>
      <a class="nav__link" href="guide.html">사용 안내</a>
    </div>
    <div class="nav__actions">
      <a class="btn btn--primary btn--sm" href="releases.html" aria-current="page">
        <span>다운로드</span>
        <span class="btn__icon-badge"><svg class="icon" aria-hidden="true"><use href="assets/icons.svg#arrow-up-right"/></svg></span>
      </a>
      <button class="nav__hamburger" id="nav-toggle" aria-label="메뉴 열기" aria-expanded="false">
        <svg class="icon" aria-hidden="true"><use href="assets/icons.svg#list"/></svg>
      </button>
    </div>
  </nav>
</div>

<!-- Mobile Navigation Drawer -->
<div class="mobile-menu-overlay" id="mobile-menu" aria-hidden="true">
  <div class="mobile-menu-links">
    <a class="mobile-menu-link" href="index.html#how-it-works">작동 방식</a>
    <a class="mobile-menu-link" href="index.html#features">핵심 기능</a>
    <a class="mobile-menu-link" href="index.html#mobile">모바일 연결</a>
    <a class="mobile-menu-link" href="guide.html">사용 안내</a>
    <a class="mobile-menu-link" href="releases.html" style="color:var(--accent)">다운로드 ↗</a>
  </div>
</div>

<!-- Page Header -->
<header style="padding:calc(var(--nav-h) + 72px) 0 48px">
  <div class="wrap">
    <div class="reveal">
      <h1 style="font-size:clamp(2.4rem,4.2vw,3.5rem)">릴리스 다운로드</h1>
      <p class="sub" style="margin-top:14px">사용하시는 플랫폼에 맞는 빌드를 내려받으세요. 설치가 완료된 후 <a href="guide.html" style="color:var(--accent);font-weight:700">사용 안내</a>를 참고하시면 3분 안에 첫 다운로드를 시작할 수 있습니다.</p>
    </div>
  </div>
</header>

<div class="wrap rel-layout">
  <!-- Sticky Rail -->
  <aside class="rel-rail">
    <div class="bezel-shell rel-rail__box">
      <h3>운영체제 바로가기</h3>
      <a class="rel-rail__os" href="#windows"><svg class="icon" aria-hidden="true"><use href="assets/icons.svg#windows-logo"/></svg>Windows (x64 / ARM)</a>
      <a class="rel-rail__os" href="#macos"><svg class="icon" aria-hidden="true"><use href="assets/icons.svg#apple-logo"/></svg>macOS 프리뷰</a>
      <a class="rel-rail__os" href="#linux"><svg class="icon" aria-hidden="true"><use href="assets/icons.svg#linux-logo"/></svg>Linux 프리뷰</a>
      <a class="rel-rail__os" href="#android"><svg class="icon" aria-hidden="true"><use href="assets/icons.svg#android-logo"/></svg>Android 컴패니언</a>
    </div>

    <div class="bezel-shell rel-rail__box">
      <p style="font-size:0.85rem;color:var(--text-secondary);line-height:1.6">
        Windows 는 설치자(exe)를 실행하시면 됩니다. macOS 와 Linux 는 압축을 풀어 실행하는 프리뷰 빌드입니다. 전체 버전 이력 및 소스 코드는 <a href="https://git.chanpaca.net/Video-Downloader/releases" style="color:var(--accent);font-weight:700" target="_blank" rel="noopener">릴리스 저장소</a>에서 확인하실 수 있습니다.
      </p>
    </div>
  </aside>

  <!-- Releases Main Container -->
  <main id="release-root" aria-live="polite">
    <div class="bezel-shell rel-empty" id="release-loading">
      <svg class="icon" aria-hidden="true"><use href="assets/icons.svg#download-simple"/></svg>
      <h2>릴리스 목록을 불러오는 중입니다</h2>
      <p style="color:var(--text-secondary)">잠시만 기다려 주세요.</p>
    </div>
  </main>
</div>

<!-- Footer -->
<footer>
  <div class="wrap footer__row">
    <div class="footer__brand">
      <span class="nav__logo-badge" style="width:26px;height:26px;border-radius:7px">
        <svg class="icon" style="width:14px;height:14px" aria-hidden="true"><use href="assets/icons.svg#download-simple"/></svg>
      </span>
      <span>MEDIABROWSER</span>
    </div>
    <div class="footer__links">
      <a href="releases.html">다운로드</a>
      <a href="guide.html">사용 안내</a>
      <a href="https://git.chanpaca.net/Video-Downloader/releases" target="_blank" rel="noopener">릴리스 저장소</a>
    </div>
    <div class="footer__copy">
      &copy; 2026 MEDIABROWSER. All rights reserved.
    </div>
  </div>
</footer>

<script src="site.js" defer></script>
</body>
</html>