:root {
  --brand:#81D8D0;
  --brand-hover:#6FC9C0;
  --brand-active:#5EB8AF;
  --brand-deep:#4A9B92;
  --brand-soft:#A8E3DD;
  --brand-softer:#C8EEEA;
  --brand-subtle:#E5F5F3;
  --bg-mist:#F7F9F9;
  --bg-surface:#FFFFFF;
  --bg-subtle:#EEF3F2;
  --text-primary:#2A3F3D;
  --text-secondary:#5A6E6C;
  --text-muted:#8A9B99;
  --text-on-brand:#FFFFFF;
  --accent-warm:#D4A5A5;
  --accent-urgent:#A89BAE;
  --accent-success:#7FB8A8;
  --accent-warning:#D4A574;
  --accent-error:#C87B7B;
  --border:#D9E5E3;
  --border-subtle:#DDE8E5;
  --border-strong:#A8C0BC;
  --shadow-ring:0 0 0 1px rgba(42,63,61,.04);
  --shadow-soft:0 12px 32px rgba(42,63,61,.08);
  --shadow-lift:0 18px 42px rgba(42,63,61,.14);
  --shadow-brand:0 12px 28px rgba(129,216,208,.35);
  --font-sans:-apple-system,BlinkMacSystemFont,"Inter","Segoe UI","Helvetica Neue",Helvetica,Arial,"PingFang SC","Microsoft YaHei","Source Han Sans SC","Noto Sans SC",sans-serif;
  --font-serif:"Source Han Serif SC","Noto Serif SC","Songti SC","STSong","SimSun","宋体",serif;
  --font-mono:"SF Mono","JetBrains Mono","Cascadia Code","Menlo","Consolas","Roboto Mono",monospace;
  --ease-out-expo:cubic-bezier(.16,1,.3,1);
  --ease-out-quart:cubic-bezier(.25,1,.5,1);
  --ease-in-out:cubic-bezier(.65,0,.35,1);
  --ease-spring:cubic-bezier(.2,.8,.2,1);
  --ease-smooth:cubic-bezier(.4,0,.2,1);
  --ease-decel:cubic-bezier(0,0,.2,1);
  --dur-fast:120ms;
  --dur-base:200ms;
  --dur-mid:320ms;
  --dur-slow:520ms;
  --dur-epic:900ms;
}

[data-theme="dark"] {
  --brand:#A8E3DD;
  --brand-hover:#C8EEEA;
  --brand-active:#81D8D0;
  --brand-deep:#C8EEEA;
  --brand-soft:#4A9B92;
  --brand-softer:#3A7E76;
  --brand-subtle:#1F3532;
  --bg-mist:#151F1E;
  --bg-surface:#1C2928;
  --bg-subtle:#243331;
  --text-primary:#F0F7F6;
  --text-secondary:#C8D6D4;
  --text-muted:#8DA19E;
  --text-on-brand:#15302D;
  --border:#304542;
  --border-subtle:#273A37;
  --border-strong:#5F8580;
}

[data-theme="contrast"] {
  --brand:#5A3A2E;
  --brand-hover:#3E2A20;
  --brand-active:#2A1F18;
  --brand-deep:#1F1611;
  --brand-soft:#A88670;
  --brand-softer:#D4B8A0;
  --brand-subtle:#EFE4D6;
  --bg-mist:#F5EFE3;
  --bg-surface:#FBF6EC;
  --bg-subtle:#E8DFCE;
  --text-primary:#2A211C;
  --text-secondary:#5F5148;
  --text-muted:#8D8176;
  --text-on-brand:#FFF8EF;
  --border:#D6C8B5;
  --border-subtle:#E1D5C4;
  --border-strong:#A88670;
}

* {
  box-sizing:border-box;
}

body {
  margin:0;
  min-width:320px;
  color:var(--text-primary);
  background:var(--bg-mist);
  font-family:var(--font-sans);
  font-size:15px;
  letter-spacing:0;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-feature-settings:"tnum","kern","liga","ss01";
}

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

h1,
h2,
h3,
p,
dl,
dd {
  margin-top:0;
}

.muted {
  color:var(--text-muted);
  font-size:13px;
  line-height:1.6;
}

.card {
  border:1px solid var(--border-subtle);
  border-radius:8px;
  background:var(--bg-surface);
  box-shadow:var(--shadow-ring),var(--shadow-soft);
}

.btn-primary {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:40px;
  border:0;
  border-radius:6px;
  padding:11px 22px;
  color:var(--text-on-brand);
  background:var(--brand);
  font-size:14px;
  font-weight:500;
  text-decoration:none;
  transition:all var(--dur-base) var(--ease-spring);
}

.btn-primary:hover {
  background:var(--brand-hover);
  box-shadow:var(--shadow-brand);
  transform:translateY(-1px);
}

.btn-secondary {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:36px;
  border:1px solid var(--border);
  border-radius:6px;
  padding:9px 16px;
  color:var(--brand-deep);
  background:var(--bg-surface);
  box-shadow:var(--shadow-ring);
  font-size:13px;
  font-weight:500;
  text-decoration:none;
  transition:all var(--dur-base) var(--ease-spring);
}

.btn-secondary:hover {
  border-color:var(--brand-soft);
  background:var(--brand-subtle);
}

.btn-ghost {
  border:0;
  border-radius:6px;
  padding:8px 13px;
  color:var(--text-secondary);
  background:transparent;
  font-size:13px;
  transition:all var(--dur-fast) var(--ease-smooth);
}

.btn-ghost:hover {
  color:var(--text-primary);
  background:var(--bg-subtle);
}

.tag {
  display:inline-flex;
  align-items:center;
  min-height:22px;
  border-radius:9999px;
  padding:3px 11px;
  color:var(--brand-deep);
  background:var(--brand-subtle);
  font-size:11px;
  font-weight:500;
}

.input {
  width:100%;
  border:1px solid var(--border);
  border-radius:6px;
  padding:12px 16px;
  color:var(--text-primary);
  background:var(--bg-surface);
  box-shadow:var(--shadow-ring);
  font-size:14px;
  transition:all var(--dur-base) var(--ease-smooth);
}

.input:focus {
  outline:none;
  border-color:var(--brand);
  box-shadow:0 0 0 3px rgba(129,216,208,.18);
}