* {
  box-sizing: border-box;
}

[v-cloak] {
  display: none;
}

html[data-theme="light"] {
  color-scheme: light;
}

html[data-theme="dark"] {
  color-scheme: dark;
}

body {
  margin: 0;
  font-family: "Segoe UI", "Microsoft YaHei", "PingFang SC", "Helvetica Neue", Arial, sans-serif;
  color: var(--ink);
  background: var(--page-bg);
  min-height: 100vh;
}

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

img,
svg {
  max-width: 100%;
  display: block;
}

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

:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

body[data-loading="true"]::before {
  content: '';
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.35);
  z-index: 999;
}

body[data-loading="true"]::after {
  content: attr(data-loading-text);
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 12px 18px;
  border-radius: 14px;
  background: var(--surface);
  color: var(--ink);
  box-shadow: 0 16px 32px var(--shadow);
  font-size: 14px;
  font-weight: 600;
  z-index: 1000;
}