*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f4f6f2;color:#2c4136;font:14px/1.7 system-ui,-apple-system,"PingFang SC",sans-serif}button,input,select,textarea{font:inherit}button,a,input,select,textarea{outline-offset:3px}button{padding:9px 14px;border:1px solid #d4ded3;border-radius:9px;background:#fff;color:#315340;cursor:pointer}button:hover{background:#edf4e7}button:disabled{opacity:.45;cursor:default}.primary{background:#315e44;color:#fff;border-color:#315e44}.primary:hover{background:#244831}a{color:#456b47;text-decoration:none}header{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 38px;background:#fff;border-bottom:1px solid #e0e7dc}.brand{display:flex;gap:10px;align-items:center;color:#273e33;font-size:21px;font-weight:700}.brand span{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#284d3a;color:#d2e6b0;font-size:29px}.brand b{font-size:10px;letter-spacing:2px;color:#8a9b83}header>a:last-child{font-size:12px}main{max-width:1500px;margin:auto;padding:38px}.intro h1{font-size:36px;line-height:1.4;letter-spacing:-1px;margin:9px 0 13px}.intro>p:last-child{color:#82927b;font-size:13px}.eyebrow{font-size:9px;letter-spacing:2px;color:#8a9b80;font-weight:700;margin:0}.steps{display:flex;gap:28px;border-bottom:1px solid #dce6d5;padding:21px 0;margin-bottom:25px}.steps a{font-size:12px;color:#678258}.builder{display:grid;grid-template-columns:340px minmax(0,1fr);gap:28px}.controls{display:flex;flex-direction:column;gap:18px}.card{border:1px solid #dfe7d9;background:#fff;border-radius:13px;padding:23px;min-width:0;scroll-margin-top:18px}h2{font-size:18px;margin:0 0 17px;font-weight:500;color:#779266}h2 span{font-weight:650;color:#2e4737;margin-left:9px}.card-title{display:flex;justify-content:space-between;align-items:center}.card-title>span{font-size:11px;color:#879b79}label{display:block;font-size:11px;color:#7c9173;margin:12px 0 6px}input:not([type=checkbox],[type=range],[type=file]),select,textarea{display:block;width:100%;height:38px;border:1px solid #d9e4d1;border-radius:8px;padding:0 10px;background:#fff;color:#45623a;min-width:0}textarea{height:auto;min-height:110px;padding:9px 10px;resize:vertical}input[type=range]{width:100%;accent-color:#527346;display:block;margin:8px 0}input[type=file]{width:100%;font-size:11px}input[type=checkbox]{accent-color:#456f3b}output{float:right;color:#49643d}.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.check{display:flex;gap:8px;align-items:flex-start;font-size:11px;line-height:1.8}.check input{margin-top:5px;flex:none}.model-list{margin:12px 0;height:230px;overflow:auto;display:grid;gap:5px}.model-list button{display:flex;align-items:center;text-align:left;border:1px solid transparent;background:#f5f7f0;padding:9px 12px;font-size:12px;justify-content:space-between}.model-list button.active{border-color:#8cac76;background:#edf4e4}.model-list button small{color:#9da98e;font-size:9px}.selected{margin:12px 0 0;color:#597248;font-size:12px}.note{font-size:11px;color:#929e85;line-height:1.8;margin:13px 0 0}.status{font-size:12px;color:#587746;overflow-wrap:anywhere;line-height:1.8}details{border-top:1px solid #e6eddf;padding-top:14px;margin-top:17px}summary{cursor:pointer;color:#738c61;font-size:12px}.actions{display:flex;flex-wrap:wrap;gap:8px;margin:17px 0}.actions button{font-size:12px}.quiet{background:none;font-size:11px;color:#729062}.right-column{min-width:0;display:flex;flex-direction:column;gap:24px}.preview-card{border:1px solid #dce7d3;border-radius:15px;background:#fff;padding:23px;position:relative;z-index:1}.preview-heading{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:19px}.preview-heading h2{font-size:19px;color:#3f5d36;margin:5px 0 0}.preview-heading button{font-size:11px;flex:none}.scene{position:relative;height:580px;overflow:hidden;border:1px solid #dce7d3;border-radius:12px;background:radial-gradient(ellipse at 72% 85%,#e6eed7,#fbfcf8 70%);isolation:isolate}.mock-browser{height:37px;background:#fff9;border-bottom:1px solid #e1ead8;padding:11px 15px;display:flex;align-items:center;gap:5px}.mock-browser i{width:6px;height:6px;border-radius:50%;background:#d3dfc8}.mock-browser span{font-size:10px;color:#a4b096;margin-left:12px}.site-content{padding:55px 35px;max-width:420px;pointer-events:none}.site-content>span{font-size:9px;letter-spacing:2px;color:#a7b79a}.site-content h3{font-size:23px;font-weight:500;color:#688456;margin:13px 0}.site-content p{font-size:12px;color:#a0ae92}.fake-card{width:190px;height:70px;background:#e9efe1;border-radius:9px;margin-top:40px}.fake-line{width:200px;height:6px;background:#e8edde;border-radius:3px;margin-top:12px}.fake-line.short{width:140px}.preview-options{display:flex;align-items:center;gap:8px}.preview-options button{font-size:11px;padding:7px 10px}.preview-options span{font-size:10px;color:#91a080;margin-left:auto}.export-card{background:#fdfefb}.export-card>p{font-size:12px;color:#8d9d7f}pre{background:#eef3e7;color:#667e52;font:10px/1.8 ui-monospace,monospace;padding:15px;border-radius:9px;overflow:auto;max-height:320px;white-space:pre-wrap;overflow-wrap:anywhere}footer{padding:20px;border-top:1px solid #e1e8dc;text-align:center;font-size:10px;color:#a0ad95}button[hidden]{display:none}@media(max-width:1050px){main{padding:26px}.builder{grid-template-columns:300px minmax(0,1fr);gap:19px}.preview-card,.card{padding:18px}.scene{height:560px}.site-content{padding:40px 20px}.site-content h3{font-size:20px}}@media(max-width:760px){header{padding:0 18px;height:65px}.brand{font-size:18px}.brand b{display:none}main{padding:24px 16px}.intro h1{font-size:27px}.steps{gap:14px;justify-content:space-between}.steps a{font-size:10px}.builder{display:flex;flex-direction:column}.right-column{display:contents}.controls{display:contents}.preview-card{position:relative;top:0;order:1;margin-top:0}.controls>#choose{order:0}.controls>#customize{order:2}.controls>.card:last-child{order:3}.export-card{order:4}.scene{height:570px}.site-content{padding:30px 20px}.preview-heading h2{font-size:16px}.preview-heading button{padding:7px;font-size:10px}.brand span{width:32px;height:32px}.preview-options{flex-wrap:wrap}}

.model-list{height:auto;max-height:240px;display:flex;flex-direction:column}.model-list button{flex-shrink:0}.roles-options{max-height:270px;overflow:auto;display:grid;gap:4px;margin-top:14px}.role-choice{display:flex;align-items:center;gap:9px;font-size:12px;padding:8px;border-radius:7px;background:#f5f7f0;margin:0}.role-choice input{flex:none}#save-role{margin-top:10px}

.role-choice{min-height:44px}.role-choice span{min-width:0;overflow-wrap:anywhere}
