feat: add dismissible domain migration notice

UPDATES.md

@@ -1,7 +1,15 @@
 ---
-updatedAt: 2026-09-20T12:25:36Z
+updatedAt: 2026-09-21T00:42:09Z
 ---
 
+## 2026년 9월 21일
+
+### 사이트 주소 변경 사전 안내
+
+`NOTICE` 모든 페이지 상단에 2026년 9월 28일 00:00(한국 시간) doricalc.cc 이전 예정 안내를 추가했습니다. 주소 변경 후 기존 저장 데이터를 사용하려면 JSON 백업 내보내기·가져오기가 필요합니다. 안내에서 사용자 데이터로 바로 이동할 수 있으며, 이전 직전 최신 데이터로 다시 백업해 주세요.
+
+안내의 X 버튼을 누르면 페이지를 이동해도 닫힌 상태를 유지하며, 새로고침하면 다시 표시합니다. ‘자세한 안내’에서 도메인 이전 관련 게시글을 확인할 수 있습니다.
+
 ## 2026년 9월 20일
 
 ### 이벤트 기능 복구

offline/OfflineApp.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
   import { onMount } from 'svelte';
   import AnalyticsConsent from '../src/lib/components/AnalyticsConsent.svelte';
+  import DomainMigrationNotice from '../src/lib/components/DomainMigrationNotice.svelte';
   import HomePage from '../src/routes/+page.svelte';
   import CardsPage from '../src/routes/cards/+page.svelte';
   import AnalysisPage from '../src/routes/analysis/+page.svelte';
@@ -80,6 +81,8 @@
   });
 </script>
 
+<DomainMigrationNotice />
+
 <header class="site-nav">
   <div class="nav-inner">
     <a class="brand" href="#/" aria-label="홀로도리 계산기 홈">홀로도리 계산기</a>

src/lib/components/DomainMigrationNotice.svelte

@@ -0,0 +1,38 @@
+<script lang="ts">
+  let dismissed = false;
+</script>
+
+{#if !dismissed}
+<aside class="migration-notice" aria-labelledby="migration-title">
+  <div class="notice-inner">
+    <button class="dismiss" type="button" aria-label="사이트 주소 변경 안내 닫기" on:click={() => dismissed = true}><span aria-hidden="true">×</span></button>
+    <div class="notice-copy">
+      <h2 id="migration-title">9월 28일 00:00부터 사이트 주소가 doricalc.cc로 변경됩니다</h2>
+      <p>주소 변경 후에는 기존 저장 데이터가 자동으로 옮겨지지 않습니다. 지금 사용하는 브라우저에서 <strong>백업 내보내기</strong>로 JSON 파일을 보관해 주세요. 이전 완료 후 새 주소의 ‘사용자 데이터 → 일반’에서 <strong>백업 가져오기</strong>를 해주세요.</p>
+      <p class="notice-schedule">이전 예정: 2026년 9월 28일 00:00 (한국 시간) · 이전 직전에는 최신 데이터로 다시 백업해 주세요.</p>
+    </div>
+    <div class="notice-actions">
+      <a href="/data">사용자 데이터로 이동 <span aria-hidden="true">→</span></a>
+      <a href="https://gall.dcinside.com/mgallery/board/view/?id=holodreams&no=50312" target="_blank" rel="noopener noreferrer" aria-label="자세한 안내 (디시인사이드, 새 탭)">자세한 안내 <span aria-hidden="true">↗</span></a>
+    </div>
+  </div>
+</aside>
+{/if}
+
+<style>
+  .migration-notice { border-bottom: 1px solid #725536; background: #30261d; color: #f4e6d4; }
+  .notice-inner { position: relative; display: flex; align-items: center; gap: 16px 28px; width: min(var(--page-max-width), calc(100% - var(--page-gutter))); margin: 0 auto; padding: 16px 48px 16px 0; }
+  .dismiss { position: absolute; top: 10px; right: 0; display: grid; place-items: center; width: 36px; height: 36px; border: 0; border-radius: 8px; background: transparent; color: #ffe1b8; font-size: 26px; cursor: pointer; }
+  .dismiss:hover { background: #493723; }
+  .notice-actions { display: flex; flex-wrap: wrap; gap: 8px; }
+  .notice-copy { flex: 1; min-width: 0; }
+  h2 { margin: 0 0 6px; color: #ffd49a; font-size: 15px; line-height: 1.5; overflow-wrap: anywhere; }
+  p { margin: 0; font-size: 13px; line-height: 1.7; word-break: keep-all; overflow-wrap: anywhere; }
+  .notice-schedule { margin-top: 4px; color: #d7c1a6; }
+  a { flex-shrink: 0; padding: 10px 14px; border: 1px solid #a88352; border-radius: 9px; color: #ffe1b8; font-size: 13px; font-weight: 750; line-height: 1.5; text-decoration: none; }
+  a:hover { background: #493723; }
+  a:focus-visible, button:focus-visible { outline: 3px solid #ffd49a; outline-offset: 3px; }
+  @media (max-width: 760px) {
+    .notice-inner { flex-direction: column; align-items: flex-start; gap: 12px; }
+  }
+</style>

src/routes/+layout.svelte

@@ -2,6 +2,7 @@
   import { onMount } from 'svelte';
   import { page } from '$app/stores';
   import AnalyticsConsent from '$lib/components/AnalyticsConsent.svelte';
+  import DomainMigrationNotice from '$lib/components/DomainMigrationNotice.svelte';
   import { events } from '$lib/data/events.ts';
   import { createInitialReleaseClock, synchronizeReleaseClock } from '$lib/data/release-clock.ts';
   import { activeEventAt } from '$lib/engine/event-optimization.ts';
@@ -26,6 +27,8 @@
   });
 </script>
 
+<DomainMigrationNotice />
+
 <header class="site-nav">
   <div class="nav-inner">
     <a class="brand" href="/" aria-label="홀로도리 계산기 홈">홀로도리 계산기</a>