/* ============================================================
   神仙鱼 hrdai — 共享品牌系统
   红蓝飞鸟 · 任我行 · 玩味俏皮
   字体自托管(国内友好):手写 Ma Shan Zheng + 楷 LXGW WenKai(subset) + 等宽 JetBrains Mono。
   正文衬线 Noto Serif SC 走系统 Songti/STSong 回退。
   ============================================================ */

@font-face{font-family:'Ma Shan Zheng';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/mashanzheng-subset.woff2') format('woff2');}
@font-face{font-family:'LXGW WenKai TC';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/lxgw-subset.woff2') format('woff2');}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/jetbrains-mono-400.woff2') format('woff2');}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/jetbrains-mono-500.woff2') format('woff2');}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/jetbrains-mono-600.woff2') format('woff2');}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:800;font-display:swap;src:url('../fonts/jetbrains-mono-600.woff2') format('woff2');}

:root {
  /* —— 红蓝双色(logo 色)+ 暖纸底 —— */
  --red:        #E63A46;   /* 飞鸟之红 */
  --red-deep:   #C1212E;
  --red-soft:   #FBE3E2;
  --blue:       #2746E0;   /* 天海之蓝 */
  --blue-deep:  #16277F;
  --blue-soft:  #DEE3FC;

  --paper:      #F6F2E9;   /* 暖纸白 */
  --paper-2:    #EEE8DA;
  --card:       #FCFAF4;
  --ink:        #18161C;   /* 暖墨黑 */
  --ink-soft:   #514D58;
  --ink-faint:  #908B97;
  --line:       rgba(24,22,28,.13);
  --line-soft:  rgba(24,22,28,.07);

  /* —— 字体(自托管体系:手写/楷/衬线/等宽)—— */
  --hand:    'Ma Shan Zheng', cursive;                              /* 手写 */
  --kai:     'LXGW WenKai TC', 'Noto Serif SC', 'Songti SC', serif;  /* 楷体(subset 缺字回退系统) */
  --serif:   'Noto Serif SC', 'Songti SC', 'STSong', serif;          /* 正文衬线 */
  --cn:      'Noto Serif SC', 'Songti SC', serif;
  --mono:    'JetBrains Mono', ui-monospace, 'SFMono-Regular', monospace;
  --sans:    system-ui, -apple-system, 'Segoe UI', 'Noto Sans SC', sans-serif;
  --display: 'LXGW WenKai TC', 'Noto Serif SC', 'Songti SC', serif;

  --maxw: 1200px;
  --r: 18px;
  --shadow: 0 1px 2px rgba(24,22,28,.05), 0 18px 44px -22px rgba(24,22,28,.28);
  --shadow-lift: 0 2px 4px rgba(24,22,28,.06), 0 34px 70px -28px rgba(24,22,28,.4);
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }
/* 移动端横向溢出兜底 — clip 不破坏 sticky */
html, body { overflow-x: clip; max-width: 100%; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--serif);
  font-size: 17px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

::selection { background: var(--red); color: #fff; }

a { color: inherit; text-decoration: none; }

h1, h2, h3 { font-weight: 700; line-height: 1.12; margin: 0; text-wrap: balance; word-break: keep-all; }
p { text-wrap: pretty; }

.display { font-family: var(--display); font-weight: 400; letter-spacing: .01em; line-height: 1.05; }
.kai { font-family: var(--kai); }
.hand { font-family: var(--hand); }

.mono { font-family: var(--mono); }
.en   { font-family: var(--sans); }

/* —— 容器 —— */
.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 28px; }

/* —— 飞鸟标记 —— */
.fishmark { display: inline-block; vertical-align: middle; }

/* —— 标签 / chip —— */
.chip {
  display: inline-flex; align-items: center; gap: .5em;
  font-family: var(--mono); font-size: 12px; letter-spacing: .06em;
  text-transform: uppercase;
  padding: 6px 12px; border-radius: 100px;
  border: 1px solid var(--line); color: var(--ink-soft);
  background: var(--card);
}
.chip .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--red); }

/* —— 按钮 —— */
.btn {
  display: inline-flex; align-items: center; gap: .6em;
  font-family: var(--sans); font-weight: 600; font-size: 16px;
  padding: 13px 22px; border-radius: 100px;
  border: 1.5px solid var(--ink); background: var(--ink); color: var(--paper);
  cursor: pointer; transition: transform .18s cubic-bezier(.2,.8,.2,1), box-shadow .18s, background .18s, color .18s;
}
.btn:hover { transform: translateY(-2px); box-shadow: 0 12px 28px -12px rgba(24,22,28,.55); }
.btn:active { transform: translateY(0); }
.btn--red  { background: var(--red);  border-color: var(--red);  color: #fff; }
.btn--blue { background: var(--blue); border-color: var(--blue); color: #fff; }
.btn--ghost { background: transparent; color: var(--ink); }
.btn--ghost:hover { background: var(--ink); color: var(--paper); }

/* —— 通用动效 utility —— */
.reveal { opacity: 1; transform: none; }
html.reveal-on .reveal { opacity: 0; transform: translateY(22px); transition: opacity .8s cubic-bezier(.2,.8,.2,1), transform .8s cubic-bezier(.2,.8,.2,1); }
html.reveal-on .reveal.in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  html.reveal-on .reveal { transition: none; opacity: 1; transform: none; }
}

/* —— 占位图(条纹 + 等宽说明)—— */
.ph {
  position: relative; overflow: hidden;
  background:
    repeating-linear-gradient(135deg, var(--line-soft) 0 10px, transparent 10px 20px),
    var(--paper-2);
  border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center;
  color: var(--ink-faint); font-family: var(--mono); font-size: 12px;
  letter-spacing: .04em; text-align: center; padding: 16px;
}

img.slot { display: block; width: 100%; height: 100%; object-fit: cover; }

/* nav 链接不换行 */
.nav .back, .nav .name, .brandlock, .brandlock .name { white-space: nowrap; }