:root { --bg:#faf7f2; --fg:#1f2a2e; --muted:#5b6a70; --accent:#2f7d6d; --card:#fff; --line:#e3ddd3; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, -apple-system, "Segoe UI", sans-serif; background:var(--bg); color:var(--fg); line-height:1.5; }
header { background:var(--card); border-bottom:1px solid var(--line); }
nav { max-width:960px; margin:0 auto; padding:12px 16px; display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
nav .brand { font-weight:700; color:var(--accent); text-decoration:none; margin-right:auto; }
nav a { color:var(--fg); text-decoration:none; font-size:14px; }
main { max-width:960px; margin:0 auto; padding:24px 16px 64px; }
section { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:16px; margin:16px 0; }
h2 { margin-top:0; font-size:18px; }
.note { color:var(--muted); font-size:13px; }
.btn, button { display:inline-flex; align-items:center; gap:6px; background:var(--accent); color:#fff; border:0; border-radius:8px; padding:9px 14px; font-size:15px; cursor:pointer; text-decoration:none; }
.btn.secondary, button.secondary { background:transparent; color:var(--accent); border:1px solid var(--accent); }
.row { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
form { display:grid; gap:10px; max-width:420px; }
input, textarea, select { font:inherit; padding:8px 10px; border:1px solid var(--line); border-radius:6px; width:100%; }
label { font-size:14px; display:grid; gap:4px; }
.price { font-size:28px; font-weight:700; }
.status { font-size:14px; min-height:1.5em; }
.status.ok { color:#1d7a3a; } .status.err { color:#b3261e; }
dialog { border:1px solid var(--line); border-radius:12px; padding:20px; max-width:440px; width:calc(100% - 32px); }
dialog::backdrop { background:rgba(0,0,0,.35); }
svg { width:18px; height:18px; fill:currentColor; }