:root {
  --bg-page: #eaf0f6;
  --bg-panel: rgba(255, 255, 255, 0.82);
  --bg-panel-strong: rgba(255, 255, 255, 0.94);
  --bg-panel-soft: rgba(248, 250, 252, 0.68);
  --bg-panel-muted: rgba(241, 245, 249, 0.62);
  --text-main: #111827;
  --text-secondary: #4b5563;
  --text-muted: #9ca3af;
  --border: rgba(148, 163, 184, 0.28);
  --border-strong: rgba(100, 116, 139, 0.42);
  --glass-border: rgba(255, 255, 255, 0.72);
  --glass-blur: blur(16px) saturate(132%);
  --primary: #2563eb;
  --primary-soft: #dbeafe;
  --success: #16a34a;
  --success-soft: #dcfce7;
  --warning: #d97706;
  --warning-soft: #fef3c7;
  --danger: #dc2626;
  --danger-soft: #fee2e2;
  --info: #0891b2;
  --info-soft: #cffafe;
  --purple: #7c3aed;
  --purple-soft: #ede9fe;
  --shadow-card:
    0 10px 30px rgba(15, 23, 42, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 0.72);
  --radius-card: 12px;
  --radius-control: 8px;
  --sidebar-width-collapsed: 64px;
  --sidebar-width-expanded: 212px;
  --sidebar-width: var(--sidebar-width-collapsed);
  --topbar-height: 62px;
}

* {
  box-sizing: border-box;
}

[hidden] {
  display: none !important;
}

html,
body {
  height: 100%;
  margin: 0;
}

body {
  background: var(--bg-page);
  color: var(--text-main);
  font-family: Inter, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 14px;
  letter-spacing: 0;
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  :root {
    --bg-panel: rgba(255, 255, 255, 0.96);
    --bg-panel-soft: rgba(248, 250, 252, 0.94);
  }
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  cursor: pointer;
}

button:disabled,
input:disabled,
select:disabled {
  cursor: not-allowed;
  opacity: 0.58;
}

a {
  color: var(--primary);
}

pre,
code {
  font-family: "Cascadia Mono", Consolas, monospace;
}

pre {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
}

.muted {
  color: var(--text-muted);
}

.danger-text {
  color: var(--danger);
  font-weight: 650;
}

.secondary-text {
  color: var(--text-secondary);
}

.hidden {
  display: none !important;
}

.mono {
  font-family: "Cascadia Mono", Consolas, monospace;
}

.ellipsis {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}