feat(ui): 반응형 레이아웃 및 저장 시스템 개선

## 반응형 레이아웃
- app.dart: 화면 크기별 레이아웃 분기 로직 추가 (+173 라인)
- game_play_screen.dart: 반응형 UI 구조 개선
- layouts/, pages/ 디렉토리 추가 (새 레이아웃 시스템)
- carousel_nav_bar.dart: 캐러셀 네비게이션 바 추가
- enhanced_animation_panel.dart: 향상된 애니메이션 패널

## 저장 시스템
- save_manager.dart: 저장 관리 기능 확장
- save_repository.dart: 저장소 인터페이스 개선
- save_service.dart: 저장 서비스 로직 추가

## UI 개선
- notification_service.dart: 알림 시스템 기능 확장
- notification_overlay.dart: 오버레이 UI 개선
- equipment_stats_panel.dart: 장비 스탯 패널 개선
- cinematic_view.dart: 시네마틱 뷰 개선
- new_character_screen.dart: 캐릭터 생성 화면 개선

## 다국어
- game_text_l10n.dart: 텍스트 추가 (+182 라인)

## 테스트
- 관련 테스트 파일 업데이트

lib/src/features/game/pages/skills_page.dart

@@ -0,0 +1,162 @@
+import 'package:flutter/material.dart';
+
+import 'package:askiineverdie/data/game_text_l10n.dart' as l10n;
+import 'package:askiineverdie/data/skill_data.dart';
+import 'package:askiineverdie/l10n/app_localizations.dart';
+import 'package:askiineverdie/src/core/l10n/game_data_l10n.dart';
+import 'package:askiineverdie/src/core/model/game_state.dart';
+import 'package:askiineverdie/src/core/model/skill.dart';
+import 'package:askiineverdie/src/features/game/widgets/active_buff_panel.dart';
+
+/// 스킬 페이지 (캐로셀)
+///
+/// SpellBook 기반 스킬 목록과 활성 버프 표시.
+class SkillsPage extends StatelessWidget {
+  const SkillsPage({
+    super.key,
+    required this.spellBook,
+    required this.skillSystem,
+  });
+
+  final SpellBook spellBook;
+  final SkillSystemState skillSystem;
+
+  @override
+  Widget build(BuildContext context) {
+    final localizations = L10n.of(context);
+
+    return Column(
+      crossAxisAlignment: CrossAxisAlignment.stretch,
+      children: [
+        // 스킬 목록
+        _buildSectionHeader(context, localizations.spellBook),
+        Expanded(flex: 3, child: _buildSkillsList(context)),
+
+        // 활성 버프
+        _buildSectionHeader(context, l10n.uiBuffs),
+        Expanded(
+          flex: 2,
+          child: ActiveBuffPanel(
+            activeBuffs: skillSystem.activeBuffs,
+            currentMs: skillSystem.elapsedMs,
+          ),
+        ),
+      ],
+    );
+  }
+
+  Widget _buildSectionHeader(BuildContext context, String title) {
+    return Container(
+      padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
+      color: Theme.of(context).colorScheme.primaryContainer,
+      child: Text(
+        title,
+        style: TextStyle(
+          fontWeight: FontWeight.bold,
+          fontSize: 13,
+          color: Theme.of(context).colorScheme.onPrimaryContainer,
+        ),
+      ),
+    );
+  }
+
+  Widget _buildSkillsList(BuildContext context) {
+    if (spellBook.spells.isEmpty) {
+      return Center(
+        child: Text(
+          L10n.of(context).noSpellsYet,
+          style: const TextStyle(fontSize: 12, color: Colors.grey),
+        ),
+      );
+    }
+
+    return ListView.builder(
+      itemCount: spellBook.spells.length,
+      padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 4),
+      itemBuilder: (context, index) {
+        final spell = spellBook.spells[index];
+        final skill = SkillData.getSkillBySpellName(spell.name);
+        final spellName = GameDataL10n.getSpellName(context, spell.name);
+
+        // 쿨타임 상태 확인
+        final skillState = skill != null
+            ? skillSystem.getSkillState(skill.id)
+            : null;
+        final isOnCooldown =
+            skillState != null &&
+            !skillState.isReady(skillSystem.elapsedMs, skill!.cooldownMs);
+
+        return _SkillRow(
+          spellName: spellName,
+          rank: spell.rank,
+          skill: skill,
+          isOnCooldown: isOnCooldown,
+        );
+      },
+    );
+  }
+}
+
+/// 스킬 행 위젯
+class _SkillRow extends StatelessWidget {
+  const _SkillRow({
+    required this.spellName,
+    required this.rank,
+    required this.skill,
+    required this.isOnCooldown,
+  });
+
+  final String spellName;
+  final String rank;
+  final Skill? skill;
+  final bool isOnCooldown;
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.symmetric(vertical: 3),
+      child: Row(
+        children: [
+          // 스킬 타입 아이콘
+          _buildTypeIcon(),
+          const SizedBox(width: 8),
+          // 스킬 이름
+          Expanded(
+            child: Text(
+              spellName,
+              style: TextStyle(
+                fontSize: 13,
+                color: isOnCooldown ? Colors.grey : null,
+              ),
+              overflow: TextOverflow.ellipsis,
+            ),
+          ),
+          // 쿨타임 표시
+          if (isOnCooldown)
+            const Icon(Icons.hourglass_empty, size: 14, color: Colors.orange),
+          const SizedBox(width: 8),
+          // 랭크
+          Text(
+            rank,
+            style: const TextStyle(fontSize: 12, fontWeight: FontWeight.bold),
+          ),
+        ],
+      ),
+    );
+  }
+
+  Widget _buildTypeIcon() {
+    if (skill == null) {
+      return const SizedBox(width: 16);
+    }
+
+    final (IconData icon, Color color) = switch (skill!.type) {
+      SkillType.attack => (Icons.flash_on, Colors.red),
+      SkillType.heal => (Icons.favorite, Colors.green),
+      SkillType.buff => (Icons.arrow_upward, Colors.blue),
+      SkillType.debuff => (Icons.arrow_downward, Colors.purple),
+    };
+
+    return Icon(icon, size: 16, color: color);
+  }
+}