/* Design-Tokens, Reset und Basis-Typografie */

:root{
  --green:#16a34a; --green-d:#15803d; --green-l:#dcfce7;
  --bg:#f8fafc; --card:#ffffff; --text:#0f172a; --muted:#64748b;
  --border:#e2e8f0; --danger:#ef4444; --burn:#ea580c;
  --shadow:0 1px 3px rgba(0,0,0,.08);
}

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0}

body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  background:var(--bg); color:var(--text); font-size:16px; line-height:1.4;
  padding-bottom:40px;
}

/* Typografie */
.section-title{font-size:14px; font-weight:700; color:var(--text); margin:0 0 4px}
.hint{font-size:12px; color:var(--muted); margin-top:8px}
.hint.error{color:var(--danger)}
.hint.center{text-align:center}
.empty{text-align:center; color:var(--muted); font-size:14px; padding:18px 0}

/* Formularelemente */
label{font-size:13px; font-weight:600; color:var(--muted); display:block; margin-bottom:5px}
input[type=text],input[type=number]{
  width:100%; padding:12px; border:1px solid var(--border); border-radius:12px;
  font-size:16px; background:#fff; color:var(--text);
}
input:focus{outline:2px solid var(--green-l); border-color:var(--green)}