:root {
    --bg: #f6faf6; --panel: #ffffff; --text: #1e2a22; --muted: #6a786f;
    --line: #dbe8dd; --soft: #edf6ef; --accent: #6c8d71;
    --accent-strong: #4d6a53; --shadow: 0 16px 40px rgba(47, 73, 55, 0.08);
    --radius: 22px;
}
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", sans-serif; background: var(--bg); color: var(--text); margin: 0; line-height: 1.8; }
.shell { max-width: 980px; margin: 0 auto; padding: 24px 16px; }
.card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 30px; }
h1 { font-size: 2.5rem; color: var(--accent-strong); margin-bottom: 1rem; }
h2 { font-size: 1.8rem; border-bottom: 2px solid var(--line); padding-bottom: 10px; margin-top: 40px; }
.btn { display: inline-block; background: var(--accent-strong); color: #fff; padding: 14px 28px; border-radius: 14px; text-decoration: none; font-weight: bold; cursor: pointer; border: none; }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.content-block { background: var(--panel); padding: 20px; border-radius: 18px; border: 1px solid var(--line); }
.screen { display: none; }
.screen.active { display: block; }
.progress { height: 10px; background: #edf3ee; border-radius: 999px; overflow: hidden; margin-bottom: 20px; }
.progress span { display: block; height: 100%; background: var(--accent-strong); transition: width .3s; }
.option { display: block; padding: 15px; border: 1px solid var(--line); border-radius: 12px; margin-bottom: 10px; cursor: pointer; transition: background .2s; }
.option:hover { background: var(--soft); }
.option input { margin-right: 10px; }