/* 张玉航的星空小站 · 夜航星图（ocean 海洋主题） */
/* 深海靛 + 月白 + 琥珀金/青灰 + 细衬线标题，v1.8.0 */
/* 海洋主题与星空同属深底系，但色温偏冷青，体现独立视觉语言 */

html[data-theme="ocean"]{
  /* 背景（深海靛蓝，比星空更偏青） */
  --bg-primary: #0a1e2e;
  --bg-secondary: #0f3040;
  --bg-elevated: #122a3a;

  /* 表面 */
  --surface: rgba(15,48,64,.72);
  --surface-hover: rgba(20,60,80,.82);
  --card-solid: rgba(12,36,52,.94);

  /* 边框（青灰细描边） */
  --border: rgba(111,179,184,.28);
  --border-strong: rgba(232,176,77,.55);
  --border-hover: rgba(111,179,184,.7);

  /* 文字 */
  --text-primary: #eef5f8;
  --text-secondary: #9fc0cc;
  --text-tertiary: #5f8894;
  --text-inverse: #0a1e2e;

  /* 点缀（青灰主 + 琥珀金暖 + 暗玫瑰） */
  --accent-gold: #e8b04d;
  --accent-rose: #c77b8b;
  --accent-teal: #6fb3b8;
  --accent-lilac: #8a9ec7;
  --accent-sage: #8fb89f;
  --accent-alert: #d9785f;

  /* 语义色 */
  --accent: #6fb3b8;
  --success: #8fb89f;
  --warning: #e8b04d;
  --error: #d9785f;
  --info: #6fb3b8;

  /* 阴影（深海冷色阴影） */
  --shadow: rgba(0,0,0,.4);
  --shadow-soft: rgba(0,0,0,.28);
  --shadow-hover: 0 14px 44px rgba(0,0,0,.55);
  --shadow-glow: 0 0 24px rgba(111,179,184,.3);

  /* 背景叠加层 */
  --overlay: linear-gradient(180deg, rgba(10,30,46,.72) 0%, rgba(15,48,64,.5) 100%);
  --bg-image: url('bg-ocean.jpg');

  /* 圆角 */
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 16px;

  /* 字族 */
  --font-display: 'Noto Serif SC', 'Songti SC', 'SimSun', serif;
  --font-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'HarmonyOS Sans', 'Microsoft YaHei', sans-serif;

  /* 动效 token */
  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
  --dur-fast: 140ms;
  --dur-med: 320ms;
  --dur-slow: 600ms;
  --blur: 12px;
  --transition: all 320ms cubic-bezier(0.22, 0.61, 0.36, 1);

  /* 独立配色系统（按钮/卡片） */
  --btn-bg: var(--surface-hover);
  --btn-text: #eef5f8;
  --btn-border: 1px solid rgba(111,179,184,.4);
  --btn-hover: var(--surface-hover);
  --btn-hover-shadow: 0 0 20px rgba(111,179,184,.35), 0 14px 44px rgba(0,0,0,.5);
  --card-bg: rgba(15,48,64,.75);
  --card-border: 1px solid rgba(111,179,184,.3);
  --theme-subtitle: '海之章 · 深海呢喃';
}

/* 海洋卡片：青灰细描边 + hover 青光 */
html[data-theme="ocean"] .card,
html[data-theme="ocean"] .home-card,
html[data-theme="ocean"] .section,
html[data-theme="ocean"] .modal-content,
html[data-theme="ocean"] .checklist li{
  border: 1px solid rgba(111,179,184,.3);
  border-radius: 12px;
  box-shadow: 0 3px 12px rgba(0,0,0,.28);
}
html[data-theme="ocean"] .card:hover,
html[data-theme="ocean"] .home-card:hover{
  border-color: rgba(232,176,77,.55);
  box-shadow: 0 14px 44px rgba(0,0,0,.55), 0 0 24px rgba(111,179,184,.3);
}

/* 海洋主题标题：细衬线 */
html[data-theme="ocean"] h1,
html[data-theme="ocean"] h2,
html[data-theme="ocean"] h3{
  font-family: 'Noto Serif SC', 'Songti SC', 'SimSun', serif;
  font-weight: 600;
  letter-spacing: .5px;
  color: #eef5f8;
}
