:root {
  --bg: #f7f2ea;
  --card: #fffdf8;
  --ink: #2b3033;
  --muted: #786f66;
  --line: #ead8c5;
  --blue: #d66a42;
  --green: #2f8f86;
  --orange: #f0a23a;
  --soft: #fff0df;
  --soft2: #eef8f5;
  --rose: #f6d9d4;
  --lav: #eadcf8;
  font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: radial-gradient(circle at 20% 0%, rgba(214,106,66,.20), transparent 30%), radial-gradient(circle at 88% 8%, rgba(47,143,134,.12), transparent 28%), var(--bg);
  color: var(--ink);
}
a { color: inherit; }
.shell { max-width: 1120px; margin: 0 auto; padding: 28px 18px 64px; }
.top { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:24px; }
.brand { display:flex; align-items:center; gap:10px; font-weight:900; }
.logo { width:38px; height:38px; border-radius:14px; background:linear-gradient(135deg,var(--blue),var(--orange)); color:white; display:grid; place-items:center; }
.nav { display:flex; gap:10px; flex-wrap:wrap; }
.nav button, .ghost { border:1px solid var(--line); background:rgba(255,255,255,.78); border-radius:999px; padding:9px 14px; font-weight:700; color:var(--muted); cursor:pointer; }
.hero { background:linear-gradient(145deg,#fffdf8,var(--soft)); border:1px solid var(--line); border-radius:32px; padding:42px; box-shadow:0 24px 70px rgba(95,58,34,.12); }
.hero h1 { margin:12px 0; font-size:clamp(34px,6vw,62px); line-height:1.08; letter-spacing:-.05em; }
.hero p { color:var(--muted); max-width:760px; font-size:18px; }
.badge { display:inline-flex; border:1px solid var(--line); background:#fff; color:var(--blue); border-radius:999px; padding:7px 12px; font-weight:800; font-size:13px; }
.grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:20px; }
.grid.two { grid-template-columns:repeat(2,1fr); }
.card { background:var(--card); border:1px solid var(--line); border-radius:24px; padding:22px; margin-top:18px; }
.card h2, .card h3 { margin:0 0 10px; }
.card p { color:var(--muted); }
.btn { border:0; border-radius:18px; padding:14px 18px; background:linear-gradient(135deg,var(--blue),#b84f32); color:white; font-weight:900; cursor:pointer; box-shadow:0 12px 30px rgba(214,106,66,.24); }
.btn.secondary { background:#fff; color:var(--ink); border:1px solid var(--line); box-shadow:none; }
.btn.warn { background:linear-gradient(135deg,var(--orange),#ea580c); }
.actions { display:flex; gap:10px; flex-wrap:wrap; margin-top:18px; }
.form { display:grid; gap:12px; }
input, select, textarea {
  width:100%; border:1px solid var(--line); border-radius:16px; padding:13px 14px; font:inherit; background:#fff;
}
textarea { min-height:96px; resize:vertical; }
label { font-weight:800; font-size:14px; }
.question { display:none; }
.question.active { display:block; }
.progress { height:10px; border-radius:999px; background:#dbe8f7; overflow:hidden; }
.progress span { display:block; height:100%; background:linear-gradient(90deg,var(--blue),var(--orange)); }
.option { border:1px solid var(--line); border-radius:18px; padding:13px; margin:9px 0; cursor:pointer; background:#fff; }
.option.active { background:var(--soft); border-color:var(--blue); }
.preview { position:relative; overflow:hidden; }
.preview .fade { opacity:.52; filter:blur(.6px); max-height:44px; overflow:hidden; }
.lock { margin-top:12px; padding:12px; border-radius:16px; background:var(--soft); color:var(--blue); font-weight:900; text-align:center; }
.report-block { border-left:4px solid var(--blue); padding-left:15px; }
.recommend { border-left-color:var(--green); background:linear-gradient(145deg,#fff,var(--soft2)); }
.table { width:100%; border-collapse:collapse; min-width:760px; }
.table th,.table td { border-bottom:1px solid var(--line); padding:12px; text-align:left; vertical-align:top; }
.table th { background:var(--soft); }
.table-wrap { overflow:auto; border:1px solid var(--line); border-radius:18px; }
.qr { width:120px; height:120px; object-fit:cover; border:1px solid var(--line); border-radius:18px; background:#fff; }
.muted { color:var(--muted); }
.hidden { display:none !important; }
.toast { position:fixed; right:18px; bottom:18px; background:#111827; color:#fff; padding:12px 16px; border-radius:14px; box-shadow:0 12px 40px rgba(0,0,0,.22); z-index:10; }
.modal-mask { position:fixed; inset:0; background:rgba(43,48,51,.48); display:grid; place-items:center; padding:18px; z-index:20; }
.modal { width:min(720px,100%); max-height:88vh; overflow:auto; background:var(--card); border:1px solid var(--line); border-radius:26px; padding:24px; box-shadow:0 28px 90px rgba(43,48,51,.26); }
.modal-head { display:flex; justify-content:space-between; align-items:center; gap:14px; margin-bottom:14px; }
.modal-head h2 { margin:0; }
.close { border:1px solid var(--line); background:#fff; border-radius:999px; padding:8px 12px; cursor:pointer; }
.menu-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:16px; }
.menu-card { border:1px solid var(--line); background:linear-gradient(145deg,#fff,var(--soft)); border-radius:22px; padding:18px; cursor:pointer; }
.menu-card h3 { margin:0 0 6px; }
.menu-card p { margin:0; color:var(--muted); font-size:14px; }
.block-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; }
.mini { padding:9px 12px; border-radius:12px; font-size:13px; box-shadow:none; }
@media (max-width:760px){
  .top{align-items:flex-start; flex-direction:column}
  .hero{padding:28px}
  .grid,.grid.two{grid-template-columns:1fr}
  .actions{flex-direction:column}
  .btn{width:100%}
  .menu-grid{grid-template-columns:1fr}
}