/* ============================================================
   NEWYES 内容自动化平台 — Design Tokens
   Clean enterprise SaaS · Google-influenced restraint
   Brand: NEWYES green + neutral grey
   ============================================================ */

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

:root {
  /* — Type — */
  --font-sans: "Plus Jakarta Sans", "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --font-cjk: "Noto Sans SC", "Plus Jakarta Sans", -apple-system, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* — Neutral scale (cool grey) — */
  --n-0:  #ffffff;
  --n-25: #fbfcfe;
  --n-50: #f6f8fa;
  --n-100: #eff1f3;
  --n-150: #e5e8eb;
  --n-200: #dde0e3;
  --n-300: #cbcfd3;
  --n-400: #9ea4aa;
  --n-500: #7c838a;
  --n-600: #60666e;
  --n-700: #464b52;
  --n-800: #2e3339;
  --n-900: #1d2026;
  --n-950: #0f1217;

  /* — Brand green (NEWYES) — */
  --g-50:  #ebfaf0;
  --g-100: #d6f4e1;
  --g-200: #b1e6c6;
  --g-300: #84d2a5;
  --g-400: #54b581;
  --g-500: #309765;
  --g-600: #197d52;
  --g-700: #106442;
  --g-800: #104d34;
  --g-900: #113928;

  /* — Status — */
  --info:    #2e7fc3;
  --info-bg: #e5f4ff;
  --warn:    #d0901e;
  --warn-bg: #fff0d4;
  --danger:  #d14241;
  --danger-bg: #ffebe8;
  --ok:      var(--g-600);
  --ok-bg:   var(--g-50);
  --purple:  #7c5ec2;
  --purple-bg: #f3eeff;

  /* — Semantic — */
  --bg: var(--n-50);
  --surface: var(--n-0);
  --surface-2: var(--n-25);
  --line: var(--n-200);
  --line-strong: var(--n-300);
  --text: var(--n-900);
  --text-2: var(--n-600);
  --text-3: var(--n-500);
  --accent: var(--g-600);
  --accent-hover: var(--g-700);

  /* — Radii — */
  --r-sm: 6px;
  --r-md: 9px;
  --r-lg: 13px;
  --r-xl: 18px;
  --r-full: 999px;

  /* — Shadow — */
  --sh-xs: 0 1px 2px rgba(19,22,27,0.05);
  --sh-sm: 0 1px 2px rgba(19,22,27,0.06), 0 2px 6px rgba(19,22,27,0.05);
  --sh-md: 0 2px 4px rgba(19,22,27,0.05), 0 6px 16px rgba(19,22,27,0.08);
  --sh-lg: 0 8px 24px rgba(19,22,27,0.10), 0 2px 6px rgba(19,22,27,0.06);
  --sh-xl: 0 16px 48px rgba(19,22,27,0.16), 0 4px 12px rgba(19,22,27,0.08);

  --topbar-h: 56px;
  --sidebar-w: 240px;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--font-sans);
  background: var(--bg);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-size: 14px;
  line-height: 1.5;
}
:lang(zh), .cjk { font-family: var(--font-cjk); }

button { font-family: inherit; cursor: pointer; }
input, textarea, select { font-family: inherit; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: var(--n-300); border-radius: 999px; border: 3px solid var(--surface); }
::-webkit-scrollbar-thumb:hover { background: var(--n-400); }
::-webkit-scrollbar-track { background: transparent; }

.mono { font-family: var(--font-mono); font-feature-settings: "tnum" 1; }
.tnum { font-variant-numeric: tabular-nums; }

/* selection */
::selection { background: var(--g-200); color: var(--g-900); }

/* focus ring */
:focus-visible { outline: 2px solid var(--g-500); outline-offset: 2px; }

@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes slideUp { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes scaleIn { from { opacity: 0; transform: scale(0.97); } to { opacity: 1; transform: scale(1); } }
@keyframes shimmer { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes growBar { from { transform: scaleX(0); } to { transform: scaleX(1); } }