:root {
  --bg:#F7F5F0; --card:#fff; --text:#1A1A18; --muted:#6B6A65;
  --accent:#2D6A4F; --accent-light:#D8F3DC; --border:rgba(0,0,0,.08);
  --radius:14px;
}
* { box-sizing: border-box; margin:0; padding:0; }
body {
  font-family:'Pretendard Variable',-apple-system,sans-serif;
  background:var(--bg); color:var(--text); min-height:100vh;
  padding-bottom:env(safe-area-inset-bottom);
}
.hdr {
  display:flex; justify-content:space-between; align-items:center;
  padding:18px 20px; background:#fff; border-bottom:1px solid var(--border);
}
.hdr h1 { font-size:1.15rem; font-weight:700; color:var(--accent); }
.who { font-size:.85rem; color:var(--muted); cursor:pointer; }

.menu {
  display:grid; grid-template-columns:1fr 1fr; gap:14px;
  padding:20px; max-width:520px; margin:0 auto;
}
.card {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  background:var(--card); border-radius:var(--radius); padding:32px 16px;
  text-decoration:none; color:var(--text);
  box-shadow:0 2px 10px rgba(0,0,0,.04);
  transition:transform .15s, box-shadow .15s;
}
.card:active { transform:scale(.97); }
.card .ico { font-size:2.4rem; margin-bottom:8px; }
.card .lbl { font-size:1rem; font-weight:600; }

.page {
  max-width:520px; margin:0 auto; padding:20px;
}
.page h2 { font-size:1.25rem; margin-bottom:16px; }
.field { margin-bottom:14px; }
.field label { display:block; font-size:.85rem; color:var(--muted); margin-bottom:6px; }
.field input, .field textarea, .field select {
  width:100%; padding:12px; border:1px solid #ddd; border-radius:8px; font-size:1rem;
  font-family:inherit; background:#fff;
}
.btn-primary {
  width:100%; padding:14px; background:var(--accent); color:#fff;
  border:none; border-radius:10px; font-size:1rem; font-weight:600; cursor:pointer;
}
.btn-primary:disabled { opacity:.5; }
.back { display:inline-block; margin-bottom:14px; color:var(--muted); text-decoration:none; font-size:.9rem; }

.stars { display:flex; gap:8px; font-size:2rem; cursor:pointer; user-select:none; }
.stars span { color:#ddd; }
.stars span.on { color:#FFB400; }

.toast {
  position:fixed; bottom:24px; left:50%; transform:translateX(-50%);
  background:#222; color:#fff; padding:10px 18px; border-radius:24px; font-size:.9rem;
  opacity:0; transition:opacity .25s; pointer-events:none;
}
.toast.show { opacity:1; }