/* assets/reviews.css — minimal, clean, Google‑ish */
:root{
  --bg:#f6f7fb; --card:#fff; --ink:#171a1f; --muted:#6b7280; --border:#e5e7eb;
  --primary:#1a73e8; --shadow: 0 6px 20px rgba(0,0,0,.06);
}
*{ box-sizing: border-box; }
html,body{ height:100%; }
body{ margin:0; font:15px/1.45 ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial; background:var(--bg); color:var(--ink); }
.topbar{ position:sticky; top:0; z-index:10; background:rgba(255,255,255,.9); backdrop-filter: blur(8px); border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; padding:10px 16px; }
.brand{ font-weight:700; letter-spacing:.2px; }
.tools{ display:flex; gap:8px; align-items:center; }
.container{ max-width:960px; margin:22px auto; padding:0 16px; }
.card{ background:var(--card); border:1px solid var(--border); border-radius:12px; box-shadow: var(--shadow); padding:16px; margin:14px 0; }
.card-head{ display:flex; align-items:center; justify-content:space-between; }
.grid{ display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:12px; }
@media (max-width:800px){ .grid{ grid-template-columns: 1fr; } }
.btn{ appearance:none; border:1px solid var(--border); background:#fff; color:var(--ink); padding:8px 12px; border-radius:8px; cursor:pointer; text-decoration:none; transition: box-shadow .15s ease, transform .06s ease, border-color .2s ease; }
.btn:hover{ box-shadow: 0 6px 18px rgba(0,0,0,.08); border-color:#d1d5db; transform: translateY(-1px); }
.btn.primary{ background: var(--primary); color:#fff; border-color: transparent; }
.btn.primary:hover{ box-shadow: 0 8px 20px rgba(26,115,232,.28); }
.form{ display:grid; gap:12px; max-width: 640px; }
.field{ display:grid; gap:6px; }
label{ font-weight:600; }
input[type="text"], input[type="password"], textarea{ width:100%; border:1px solid var(--border); border-radius:8px; padding:10px 12px; font: inherit; background:#fff; }
textarea{ resize: vertical; }
.alert{ padding:10px 12px; border-radius:8px; border:1px solid; }
.alert.error{ color:#b91c1c; background:#fef2f2; border-color:#fecaca; }
.alert.ok{ color:#166534; background:#f0fdf4; border-color:#bbf7d0; }
.hint{ color: var(--muted); font-size: 13px; }
/* Stars (radio group) */
.stars{ display:inline-flex; flex-direction: row-reverse; gap:4px; }
.stars input{ display:none; }
.stars label{ font-size: 22px; color: #d1d5db; cursor: pointer; }
.stars input:checked ~ label, .stars label:hover, .stars label:hover ~ label{ color:#f59e0b; }
.stars:focus-within label{ outline: 2px solid #c7d2fe; outline-offset: 2px; }
/* Review item */
.review .r-head{ display:flex; align-items:baseline; justify-content:space-between; gap:8px; margin-bottom:8px; }
.review .r-name{ font-weight:700; }
.review .r-stars{ font-size:18px; color:#f59e0b; letter-spacing:2px; }
.review .r-body p{ margin: 0; white-space: pre-wrap; }
.review .r-foot{ margin-top:10px; color: var(--muted); font-size: 13px; }