@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400&family=DM+Mono:wght@300;400&display=swap');

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

/* ===== THEME ===== */
:root{
  --gold:#C9A84C;
  --gold-light:#E8CC7A;

  --bg:#F5F1E6;          /* warm background */
  --surface:#FFFFFF;     /* card */
  --surface-soft:#F0EAD6;

  --border:#E2D8C3;

  --text:#1A1814;
  --muted:#7A6F5A;
  --soft:#A89878;
}

/* ===== BASE ===== */
body{
  background:var(--bg);
  color:var(--text);
  font-family:'DM Mono', monospace;
}

/* ===== TITLE ===== */
.title{
  font-family:'Cormorant Garamond', serif;
  font-size:48px;
  font-weight:300;
  letter-spacing:-0.02em;
}

.title em{
  color:var(--gold);
  font-style:italic;
}

.text-secondary{
  color:var(--muted) !important;
}

/* ===== CARD ===== */
.card-dark{
  background:var(--surface);
  border:1px solid var(--border);
  padding:40px;
  border-radius:12px;
  transition:all 0.2s ease;
}

.card-dark:hover{
  box-shadow:0 10px 30px rgba(0,0,0,0.05);
}

/* ===== INPUT ===== */
.form-control{
  background:var(--surface-soft);
  border:1px solid var(--border);
  color:var(--text);
  font-size:13px;
  padding:14px 16px;
  letter-spacing:0.04em;
}

.form-control::placeholder{
  color:var(--muted);
}

.form-control:focus{
  border-color:var(--gold);
  background:#fff;
  box-shadow:none;
}

/* ===== BUTTON ===== */
.btn-gold{
  background:var(--gold);
  color:#000;
  border:none;
  padding:14px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  font-size:11px;
  transition:all 0.2s;
}

.btn-gold:hover{
  background:var(--gold-light);
}

/* ===== RESULT ===== */
.result-number{
  font-family:'Cormorant Garamond', serif;
  font-size:44px;
  font-weight:300;
  color:var(--gold);
}

.result-sub{
  font-size:11px;
  letter-spacing:0.15em;
  text-transform:uppercase;
  color:var(--muted);
}

/* ===== PROGRESS ===== */
.progress{
  height:5px;
  background:#E8E1CF;
  border-radius:4px;
}

.progress-bar{
  background:var(--gold);
  transition:width 0.6s ease;
}

/* ===== LABEL ===== */
.form-label{
  font-size:11px;
  letter-spacing:0.15em;
  text-transform:uppercase;
  color:var(--muted);
}

/* ===== TOAST ===== */
.toast{
  position:fixed;
  bottom:28px;
  right:28px;
  background:#fff;
  border:1px solid var(--gold);
  padding:14px 20px;
  font-size:11px;
  letter-spacing:0.15em;
  text-transform:uppercase;
  color:var(--gold);
  opacity:0;
  transform:translateY(10px);
  transition:all 0.3s ease;
  z-index:999;
}

.toast.show{
  opacity:1;
  transform:translateY(0);
}