/* Guardian Paws · 设计令牌
   配色按 PRD 规范：信任海洋蓝
   字体：Noto Sans SC（中文）+ Inter（拉丁/数字）
*/

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700;900&family=Noto+Serif+SC:wght@500;700;900&family=Inter:wght@400;500;600;700;800&display=swap');

:root {
  --primary: #0F4C81;
  --primary-hover: #0A3C68;
  --primary-soft: #E4EDF5;
  --secondary: #2A9D8F;
  --secondary-hover: #228377;
  --accent: #E76F51;
  --accent-hover: #D85A3C;
  --neutral-bg: #F8F6F1;
  --surface: #FFFFFF;
  --surface-2: #FBFAF6;
  --text: #1A1A1A;
  --text-muted: #6B7280;
  --text-soft: #9CA3AF;
  --border: #E5E7EB;
  --border-strong: #D1D5DB;
  --success: #2A9D8F;
  --warning: #E9C46A;
  --danger: #E76F51;

  --font-sans: "Inter", "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --font-serif: "Noto Serif SC", "Noto Sans SC", Georgia, serif;
  --font-num: "Inter", -apple-system, sans-serif;
}

:root.dark {
  --primary: #5B9BD5;
  --primary-hover: #7BB1E4;
  --primary-soft: #1A2A3A;
  --secondary: #4FBFB0;
  --secondary-hover: #6FD0C2;
  --accent: #FF8A6E;
  --accent-hover: #FF9F86;
  --neutral-bg: #0F1419;
  --surface: #1A1F26;
  --surface-2: #222831;
  --text: #F5F5F4;
  --text-muted: #9CA3AF;
  --text-soft: #6B7280;
  --border: #2D3540;
  --border-strong: #3D4550;
}

.tabular { font-variant-numeric: tabular-nums; }

/* Reset light for artboard contents */
.gp-root {
  font-family: var(--font-sans);
  color: var(--text);
  background: var(--surface);
  font-feature-settings: "ss01" on, "cv11" on;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
.gp-root * { box-sizing: border-box; }
.gp-root img { display: block; max-width: 100%; }
.gp-root h1, .gp-root h2, .gp-root h3, .gp-root h4 {
  margin: 0; font-weight: 700; letter-spacing: -0.01em; line-height: 1.15;
}
.gp-root p { margin: 0; }
.gp-root button { font-family: inherit; cursor: pointer; border: 0; background: none; }

/* Small reusable button styles */
.gp-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 48px; padding: 0 24px; border-radius: 8px;
  font-size: 15px; font-weight: 600; letter-spacing: 0;
  transition: all 200ms ease-out;
}
.gp-btn-lg { height: 56px; padding: 0 32px; font-size: 16px; }
.gp-btn-sm { height: 40px; padding: 0 18px; font-size: 14px; }
.gp-btn-primary { background: var(--primary); color: #fff; }
.gp-btn-primary:hover { background: var(--primary-hover); }
.gp-btn-accent { background: var(--accent); color: #fff; }
.gp-btn-accent:hover { background: var(--accent-hover); }
.gp-btn-ghost { background: transparent; color: var(--text); border: 1.5px solid var(--border-strong); }
.gp-btn-ghost:hover { border-color: var(--text); }
.gp-btn-ghost-light { background: transparent; color: #fff; border: 1.5px solid rgba(255,255,255,0.5); }
.gp-btn-ghost-light:hover { border-color: #fff; background: rgba(255,255,255,0.1); }

/* Chips / tags */
.gp-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px; border-radius: 999px;
  font-size: 12px; font-weight: 500;
  background: var(--primary-soft); color: var(--primary);
}
.gp-chip-accent { background: #FCE7E0; color: var(--accent-hover); }
.gp-chip-secondary { background: #DCF0EC; color: var(--secondary-hover); }
.gp-chip-neutral { background: var(--neutral-bg); color: var(--text-muted); }

/* Lucide-style line icons via SVG inline */
.gp-icon { width: 18px; height: 18px; stroke-width: 2; stroke: currentColor; fill: none; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; }