/* Xing presentation layer v1. No scripts, DOM changes, or application overrides. */
:root {
  --xing-bg: #f5f5f7;
  --xing-surface: #fff;
  --xing-ink: #1d1d1f;
  --xing-muted: #6e6e73;
  --xing-line: rgba(0,0,0,.075);
  --xing-blue: #0071e3;
  --xing-blue-hover: #0077ed;
  --xing-soft: #eaf3ff;
  --xing-glass: rgba(255,255,255,.82);
  --xing-shadow: 0 8px 32px rgba(0,0,0,.035);
}
html.dark {
  --xing-bg: #101012;
  --xing-surface: #1c1c1e;
  --xing-ink: #f5f5f7;
  --xing-muted: #a1a1a6;
  --xing-line: rgba(255,255,255,.11);
  --xing-blue: #2997ff;
  --xing-blue-hover: #4ca8ff;
  --xing-soft: #152b43;
  --xing-glass: rgba(28,28,30,.86);
  --xing-shadow: 0 8px 32px rgba(0,0,0,.14);
}
html body {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  background: var(--xing-bg);
  color: var(--xing-ink);
  -webkit-font-smoothing: antialiased;
}
body :where(button,input,select,textarea) { font-family: inherit; }
body :where(code,pre,.font-mono,.terminal-body) { font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace; }
body :where(h1,h2,h3,.stat-value) { letter-spacing: -.035em; }
body :where(.text-gray-900,.text-gray-800) { color: var(--xing-ink); }
body :where(.text-gray-500,.text-gray-600) { color: var(--xing-muted); }
#app .bg-mesh-gradient { background: none; }
#app > .min-h-screen { background-color: var(--xing-bg); }
#app .btn-primary {
  background: var(--xing-blue);
  color: #fff;
  border: 1px solid transparent;
  border-radius: 999px;
  box-shadow: none;
  font-weight: 500;
  transition: background .18s ease, box-shadow .18s ease;
}
#app .btn-primary:hover:not(:disabled) { background: var(--xing-blue-hover); box-shadow: 0 3px 12px rgba(0,113,227,.12); }
#app .btn-secondary { background: var(--xing-surface); border-color: var(--xing-line); box-shadow: none; }
#app .btn-ghost:hover { background-color: var(--xing-soft); }
#app .btn:focus-visible, #app a:focus-visible, #app button:focus-visible {
  outline: 3px solid var(--xing-blue);
  outline-offset: 3px;
}
#app .input { background: var(--xing-surface); border-color: var(--xing-line); border-radius: 12px; box-shadow: none; }
#app .input:focus { border-color: var(--xing-blue); box-shadow: 0 0 0 3px var(--xing-soft); }
#app :where(.card,.card-glass,.glass-card,.stat-card) {
  background: var(--xing-surface);
  border-color: var(--xing-line);
  border-radius: 22px;
  box-shadow: var(--xing-shadow);
}
#app .card-header, #app .card-footer { border-color: var(--xing-line); }
#app :where(.text-primary-500,.text-primary-600,.text-primary-700) { color: var(--xing-blue); }
#app :where(.bg-primary-50,.bg-primary-100,.stat-icon-primary,.badge-primary) { background-color: var(--xing-soft); color: var(--xing-blue); }
#app .text-gradient { background: none; color: var(--xing-ink); -webkit-text-fill-color: var(--xing-ink); }
#app .sidebar {
  background: var(--xing-glass);
  border-color: var(--xing-line);
  backdrop-filter: blur(24px) saturate(150%);
  box-shadow: none;
}
#app .sidebar-header { border-color: var(--xing-line); }
#app .sidebar-brand-title { letter-spacing: -.045em; font-size: 24px; font-weight: 600; }
#app .sidebar-logo { box-shadow: none; border-radius: 12px; }
#app .sidebar-link { border-radius: 10px; font-weight: 450; }
#app .sidebar-link:hover { background: var(--xing-soft); }
#app .sidebar-link-active { background: var(--xing-soft); color: var(--xing-blue); border-left-color: transparent; box-shadow: none; }
#app header.glass { background: var(--xing-glass); border-color: var(--xing-line); backdrop-filter: blur(24px) saturate(150%); }
#app .stat-value { font-weight: 600; font-variant-numeric: tabular-nums; }
#app table th { font-weight: 500; letter-spacing: .01em; }
#app :where(.shadow-glow,.shadow-glass) { box-shadow: var(--xing-shadow); }

/* Existing homepage, with every original section and action retained. */
body:has(.terminal-container) #app > div {
  background: var(--xing-bg);
  background-image: none;
}
body:has(.terminal-container) #app > div > .pointer-events-none { opacity: 0; }
body:has(.terminal-container) header {
  background: var(--xing-glass);
  backdrop-filter: blur(24px) saturate(150%);
  border-bottom: 1px solid var(--xing-line);
  padding-top: 13px;
  padding-bottom: 13px;
}
body:has(.terminal-container) header nav { max-width: 1080px; }
body:has(.terminal-container) header nav > div:first-child > div { box-shadow: none; width: 34px; height: 34px; border-radius: 10px; }
body:has(.terminal-container) main { padding-top: 104px; padding-bottom: 48px; }
body:has(.terminal-container) main > div { max-width: 1080px; }
body:has(.terminal-container) main > div > div:first-child { margin-bottom: 74px; gap: 56px; }
body:has(.terminal-container) main h1 {
  font-size: clamp(76px,8vw,116px);
  line-height: 1.02;
  font-weight: 650;
  letter-spacing: -.075em;
  margin-bottom: 22px;
  color: var(--xing-ink);
}
body:has(.terminal-container) main h1 + p { font-size: clamp(19px,2vw,25px); font-weight: 400; line-height: 1.55; letter-spacing: -.025em; max-width: 510px; color: var(--xing-muted); }
body:has(.terminal-container) main .btn-primary { padding: 12px 23px; font-size: 16px; min-height: 46px; }
body:has(.terminal-container) .terminal-container { width: 100%; max-width: 470px; perspective: none; }
body:has(.terminal-container) .terminal-window {
  width: 100%;
  transform: none;
  animation: none;
  background: linear-gradient(145deg,#29292d,#171719);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 22px;
  box-shadow: 0 30px 60px -22px rgba(0,0,0,.28), 0 2px 8px rgba(0,0,0,.08);
}
body:has(.terminal-container) .terminal-window:hover { transform: none; }
body:has(.terminal-container) .terminal-header { background: rgba(255,255,255,.025); border-color: rgba(255,255,255,.06); padding: 17px 20px; }
body:has(.terminal-container) .terminal-title { color: #a1a1a6; font-size: 11px; letter-spacing: .045em; }
body:has(.terminal-container) .terminal-body { padding: 26px; min-height: 170px; font-size: 12px; }
body:has(.terminal-container) .code-cmd { color: #8fcaff; }
body:has(.terminal-container) .code-url { color: #d3d3d8; }
body:has(.terminal-container) .code-comment { color: #96969e; }
body:has(.terminal-container) main > div > .flex.flex-wrap > div {
  background: var(--xing-surface);
  border-color: var(--xing-line);
  box-shadow: none;
  --tw-ring-color: transparent;
}
body:has(.terminal-container) main > div > .grid { gap: 22px; margin-bottom: 76px; }
body:has(.terminal-container) main > div > .grid > div {
  background: var(--xing-surface);
  border: 1px solid var(--xing-line);
  border-radius: 24px;
  padding: 32px;
  box-shadow: none;
  transition: box-shadow .2s ease;
}
body:has(.terminal-container) main > div > .grid > div:hover { box-shadow: var(--xing-shadow); }
body:has(.terminal-container) main > div > .grid > div > div:first-child {
  width: 44px; height: 44px; border-radius: 14px;
  background: var(--xing-ink); box-shadow: none; transform: none;
}
body:has(.terminal-container) main > div > .grid > div > div:first-child svg { color: var(--xing-surface); }
body:has(.terminal-container) main h3 { font-size: 21px; font-weight: 600; margin-top: 20px; margin-bottom: 12px; }
body:has(.terminal-container) main h3 + p { font-size: 14px; line-height: 1.9; }
body:has(.terminal-container) main h2 { font-size: 32px; font-weight: 600; letter-spacing: -.045em; }
body:has(.terminal-container) footer { background: var(--xing-bg); border-color: var(--xing-line); font-size: 12px; padding-top: 26px; padding-bottom: 26px; }

/* Authentication page: same forms, same validation, quieter surfaces. */
body:has(.card-glass form) #app .absolute.inset-0.bg-gradient-to-br { background: var(--xing-bg); }
body:has(.card-glass form) #app .pointer-events-none.absolute.inset-0 { opacity: 0; }
body:has(.card-glass form) #app .card-glass { border-radius: 26px; padding: 36px; }
body:has(.card-glass form) #app h1 { font-size: 42px; letter-spacing: -.06em; font-weight: 600; }
body:has(.card-glass form) #app .shadow-lg { box-shadow: none; }

@media (max-width: 1023px) {
  body:has(.terminal-container) main { padding-top: 64px; }
  body:has(.terminal-container) main h1 + p { margin-left: auto; margin-right: auto; }
  body:has(.terminal-container) main > div > div:first-child { gap: 42px; margin-bottom: 48px; }
  body:has(.terminal-container) .terminal-container { max-width: 460px; }
  body:has(.terminal-container) main > div > div:first-child > div { min-width: 0; width: 100%; }
}
@media (max-width: 640px) {
  body:has(.terminal-container) main { padding: 48px 20px 28px; }
  body:has(.terminal-container) main h1 { font-size: 78px; }
  body:has(.terminal-container) main h1 + p { font-size: 19px; }
  body:has(.terminal-container) main > div > .grid { gap: 16px; margin-bottom: 48px; }
  body:has(.terminal-container) main > div > .grid > div { padding: 28px; }
  body:has(.terminal-container) main h2 { font-size: 27px; }
  body:has(.terminal-container) .terminal-body { padding: 20px; font-size: 11px; }
  body:has(.card-glass form) #app .card-glass { padding: 26px; }
}
@media (prefers-reduced-motion: reduce) {
  #app *, #app *::before, #app *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}