:root {
  --page: #f3eee7;
  --line: #eee7df;
  --ink: #302b28;
  --muted: #a69a91;
  --coral: #e87965;
  --coral-deep: #d85e4d;
  --peach: #f9d8cc;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  color: var(--ink);
  background: var(--page);
}

.bg-page { background: var(--page); }
.text-ink { color: var(--ink); }
.text-muted { color: var(--muted); }
.text-coral-deep { color: var(--coral-deep); }
.bg-coral { background: var(--coral); }
.bg-peach { background: var(--peach); }
.border-line { border-color: var(--line); }
.accent-coral { accent-color: var(--coral); }

.shadow-phone {
  box-shadow: 0 24px 80px rgba(62, 48, 40, 0.18);
}

.hidden { display: none !important; }

.scrollbar-hide::-webkit-scrollbar { display: none; }
.scrollbar-hide { scrollbar-width: none; }

.admin-tab {
  padding: 0.5rem 0.75rem;
  border-radius: 0.5rem;
  background: #fff;
  color: #796d65;
  font-size: 0.75rem;
  border: none;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.18s ease, color 0.18s ease;
}

.admin-tab.active {
  background: #403733;
  color: #fff;
}

.field {
  display: grid;
  gap: 6px;
  margin-bottom: 12px;
  font-size: 0.75rem;
  font-weight: 600;
  color: #796d65;
}

.field input,
.field select,
.field textarea {
  width: 100%;
  border: 0;
  outline: none;
  background: #f8f5f1;
  color: var(--ink);
  border-radius: 0.75rem;
  padding: 0.7rem 0.9rem;
  font: inherit;
  font-weight: 400;
  font-size: 0.875rem;
}

.field textarea {
  resize: vertical;
  line-height: 1.55;
}

.mask {
  color: var(--coral-deep);
  font-weight: 500;
  margin-left: 4px;
}

.persona {
  transition: background 0.18s ease, border-color 0.18s ease;
  cursor: pointer;
  background: #fff;
}

.persona.active {
  background: #fff0ea;
  border-color: #f2c9bc;
}

.bar {
  flex: 1;
  border-radius: 0.5rem 0.5rem 0 0;
  background: #f9d8cc;
  min-height: 12%;
  transition: height 0.35s ease;
}

.bar.hot { background: var(--coral); }

.file-input {
  max-width: 100%;
}

.sticky-save {
  position: sticky;
  bottom: 1rem;
  z-index: 10;
  padding: 0.75rem 1rem;
  background: rgba(251, 250, 248, 0.92);
  border: 1px solid var(--line);
  border-radius: 1rem;
  backdrop-filter: blur(8px);
}

button, a {
  cursor: pointer;
  text-decoration: none;
}

button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

#readyList b.ok { color: #5f9b78; }
#readyList b.warn { color: #d8785f; }