:root{
  --bg:#0b0c10;
  --card:#12141a;
  --text:#eee;
  --muted:#9aa0a6;
  --accent:#a855f7;
  --ok:#16a34a;
  --err:#ef4444;
  --border:#2a2f3a;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial,"Noto Sans","Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";}
.container{max-width:960px;margin:0 auto;padding:16px;}
header{display:flex;justify-content:space-between;align-items:center;padding-top:12px}
.brand{font-size:1.1rem;display:flex;gap:.5rem;align-items:center}
nav a{color:var(--muted);text-decoration:none;margin-left:12px}
.card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px;margin:16px 0;box-shadow:0 8px 16px rgba(0,0,0,.25)}
h1,h2,h3{margin:0 0 12px 0}
.muted{color:var(--muted)}
.small{font-size:.9rem}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:10px;border-bottom:1px solid var(--border);text-align:left}
.table thead th{font-size:.9rem;color:var(--muted)}
.form-grid{display:grid;gap:12px}
.form-inline{display:flex;gap:8px;flex-wrap:wrap}
input[type="text"],input[type="number"],textarea{width:100%;padding:10px;border-radius:10px;border:1px solid var(--border);background:#0f1117;color:var(--text)}
button,.button{background:var(--accent);color:white;border:none;padding:10px 14px;border-radius:999px;cursor:pointer;text-decoration:none;display:inline-block}
.button.small{padding:6px 10px;border-radius:14px;font-size:.85rem}
.button.outline{background:transparent;border:1px solid var(--accent);color:var(--accent)}
.flash-wrap{display:grid;gap:8px;margin-bottom:12px}
.flash{padding:10px;border-radius:10px}
.flash.ok{background:rgba(22,163,74,.15);border:1px solid rgba(22,163,74,.35)}
.flash.error{background:rgba(239,68,68,.15);border:1px solid rgba(239,68,68,.35)}
.wine-list{display:grid;gap:12px;margin:0;padding-left:18px}
.criteria{display:grid;gap:6px;margin:8px 0}
code{background:#0f1117;border:1px solid var(--border);padding:2px 6px;border-radius:6px}
/* Sterne-Bewertung – links (1) nach rechts (5) mit JS-Färbung */
.stars{
  display:flex;
  gap:6px;
  align-items:center;
  margin:8px 0;
  border:0;
  padding:0;
  flex-wrap:wrap;
}
.stars legend{
  font-weight:600;
  margin-right:8px;
  min-width:150px;
}
.stars input{ display:none }
.stars label{
  font-size:26px;
  cursor:pointer;
  color:#d1d5db; /* grau */
  transition: transform .05s ease-in-out, color .15s ease-in-out;
  user-select:none;
}
.stars label.on{ color:#fbbf24; }           /* gelb */
.stars label:active{ transform:scale(.98) }