*{box-sizing:border-box;touch-action:manipulation}body{margin:0;background:#f6f9f5;color:#203c38;font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif;line-height:1.65}main{max-width:1120px;margin:auto;padding:32px 32px 60px}h1{font-size:clamp(28px,4vw,43px);margin:5px 0 12px;letter-spacing:-1px}h2{margin:6px 0;font-size:26px}p{margin:10px 0}.eyebrow{color:#34735b;letter-spacing:2px;font-size:12px;font-weight:700}.muted,.notice{color:#687b72;font-size:13px}.hero{display:flex;justify-content:space-between;align-items:center;gap:16px}.stamp{border:1px solid #b8cead;border-radius:50%;width:88px;height:88px;display:grid;place-content:center;text-align:center;flex-shrink:0;color:#3b724c;background:#eaf2d9;font-size:13px}.tabs{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:24px 0}.tabs button{padding:12px 5px;font-size:14px}.tabs button.active{background:#246b52;color:white;border-color:#246b52}.workspace{background:white;border:1px solid #dce5db;border-radius:24px;overflow:hidden;box-shadow:0 12px 45px #233b3210}.top{padding:24px 28px 14px}.layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(260px,1fr)}.canvas{padding:16px 22px;background:#f0f5ec;border-top:1px solid #e4eada;border-bottom:1px solid #e4eada}.canvas svg{display:block;width:100%;height:auto;max-height:420px;overflow:hidden}svg text{font-family:inherit;font-size:20px;fill:#26463f}svg [data-x],svg [data-action]{cursor:pointer}.side{padding:20px 24px;min-width:0}.controls{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}button,a.button{font:inherit;color:inherit;cursor:pointer;min-height:44px;padding:10px 16px;border:1px solid #cddbd0;background:white;border-radius:12px;text-decoration:none}button:hover{background:#eaf2df}button:focus-visible,a:focus-visible{outline:3px solid #2857ef;outline-offset:3px}button.primary{background:#246b52;color:white;border-color:#246b52}button.selected{background:#e0eed8;border:2px solid #447949}button:disabled{opacity:.45;cursor:default}.choices{display:grid;gap:8px}.feedback{border-left:4px solid #ba7828;background:#fff4e2;border-radius:8px;padding:12px;margin:12px 0}.feedback.good{border-color:#357453;background:#eaf5e7}.discovery{padding:16px;background:#eef4df;border-radius:14px}.footer{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:20px 28px}.metric{font-size:26px;font-weight:700;color:#246b52;font-variant-numeric:tabular-nums}.steps{font-size:14px;color:#597263}.steps strong{color:#1c6448}label{display:block;margin:10px 0}input[type=range]{width:100%;min-height:44px;accent-color:#246b52}.results{padding:24px}.result{padding:16px;border:1px solid #dce5db;border-radius:14px;margin:12px 0}.fold{transform-box:fill-box;transform-origin:center;animation:fold .55s ease-out}@keyframes fold{from{transform:scaleY(.1)}to{transform:scaleY(1)}}@media(prefers-reduced-motion:reduce){.fold{animation:none}}@media(max-width:760px){main{padding:22px 16px 40px}.tabs{grid-template-columns:repeat(3,1fr);gap:6px}.layout{grid-template-columns:1fr}.top,.side{padding:18px}.canvas{padding:12px}.footer{padding:18px;flex-wrap:wrap}.stamp{width:65px;height:65px;font-size:11px}h2{font-size:23px}}

select{font:inherit;max-width:100%;min-height:44px;border:1px solid #cddbd0;border-radius:8px;background:white;color:#203c38;padding:6px;}
