.compose{max-width:1000px;margin:auto}.compose .workspace{overflow:visible}.compose-intro{padding:28px 30px 6px}.compose-intro h1{font-size:clamp(30px,4vw,44px);margin:6px 0 8px;letter-spacing:-.05em}.compose-intro p{color:#626779;margin:0 0 20px}.compose-body{padding:24px 30px 32px}.compose textarea{min-height:130px;line-height:1.55}.compose-actions{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}.compose-heading{font-size:24px;margin:0 0 12px}.compose-options{display:grid;gap:10px;margin:18px 0}.compose-option{display:flex;align-items:center;gap:13px;padding:15px;border:1px solid #dce2d6;border-radius:12px;background:#fafcf8;cursor:pointer}.compose-option input{width:19px;height:19px;accent-color:#537d25}.compose-option strong{display:block}.compose-option small{display:block;color:#626779;margin-top:3px;font-size:13px}.compose-selected{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}.compose-selected span{background:#eaf3dc;padding:8px 11px;border-radius:999px}.compose-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0}.compose-tile{padding:20px;text-align:left;border:1px solid #dce2d6;border-radius:14px;background:#fafcf8;color:#1b2437;min-height:100px;font-size:17px;font-weight:750}.compose-tile small{display:block;font-size:14px;color:#596473;font-weight:400;margin-top:8px}.compose-tile:hover,.compose-tile.active{border-color:#739b3c;background:#eff8e4}.compose-preview{border:1px solid #dfe4d9;border-radius:18px;background:#fff;padding:24px;margin-top:18px}.compose-preview h2{margin:0 0 6px}.compose-view{border-top:1px solid #e4e8df;padding-top:18px}.compose-list{display:grid;gap:8px;margin:16px 0}.compose-list li{display:flex;align-items:center;gap:8px;padding:10px;background:#f5f8f1;border-radius:8px}.compose-list li button{margin-left:auto}.compose-inline{display:flex;align-items:end;gap:9px;flex-wrap:wrap}.compose-inline .field{flex:1;min-width:160px;margin:0}.compose-view input{font-size:16px}.compose-note{font-size:14px;color:#626779;line-height:1.5}.compose-error{color:#a33b20}.compose-saved{border-top:1px solid #e5e9e0;margin-top:28px;padding-top:20px}.compose-saved button{margin:5px}.compose-search{width:100%;padding:12px;border:1px solid #cdd2ca;border-radius:10px}.compose-checks{display:grid;gap:12px;margin:15px 0}.compose-checks label{display:flex;align-items:center;gap:10px;font-size:16px}.compose-checks input{width:20px;height:20px;accent-color:#527b28}.compose-prompt{padding:15px;background:#f6f8f3;border-radius:10px;line-height:1.5}.compose-suggestion{padding:16px;border:1px solid #dce7cb;border-radius:12px;background:#f8fbf2;margin:14px 0}@media(max-width:650px){.compose-intro,.compose-body{padding:20px}.compose-grid{grid-template-columns:1fr}.compose-tile{min-height:80px}.compose-preview{padding:17px}}

.compose-app-frame{display:block;width:100%;min-height:620px;border:1px solid #dfe4d9;border-radius:12px;background:white}
.compose-builder{border:1px solid #d8e3d8}.compose-builder .compose-intro{background:#173d30;color:#fff;border-radius:20px 20px 0 0;padding:30px}.compose-builder .compose-intro .eyebrow{color:#baf170}.compose-builder .compose-intro p{color:#e3eee5;max-width:650px}.compose-builder .compose-body{max-width:780px}.compose-builder h2{font-size:23px;margin:8px 0 16px}.compose-stack{max-width:570px}.compose-source{border:1px solid #cbdcc9;border-radius:15px;background:#f8fbf6;padding:15px 17px}.compose-source-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.compose-source-head strong{font-size:18px}.compose-source-head button{border:0;background:transparent;font-size:25px;color:#58685b;padding:4px 9px;min-height:38px}.compose-source p{margin:7px 0;color:#58695b;font-size:14px}.compose-source summary{cursor:pointer;color:#315a38;font-weight:650;font-size:14px}.compose-feature-list{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 2px}.compose-feature-list label{display:flex;align-items:center;gap:5px;font-size:14px}.compose-feature-list input{width:18px;height:18px;accent-color:#377842}.compose-plus{text-align:center;font-size:26px;color:#55775c;line-height:1.7}.compose-add{margin:16px 0}.compose-instructions{border-top:1px solid #e0e8dd;margin-top:25px;padding-top:20px}.compose-instructions textarea{min-height:150px}.compose-picker{padding:17px;border:1px solid #d5e2d2;border-radius:14px;background:#f8fbf6;margin:12px 0}.compose-picker .compose-options{max-height:320px;overflow:auto;margin:6px 0 15px}.compose-picker .compose-options button{display:block;text-align:left;background:white;border:1px solid #e0e8dd;border-radius:9px;padding:11px;width:100%;cursor:pointer}.compose-picker .compose-options button:hover{background:#eaf7e5}.compose-picker .compose-options small{display:block;color:#69746b;margin-top:3px;font-size:13px}.compose-generated{border-top:1px solid #dce7d9;margin-top:28px;padding-top:22px}.compose-generated iframe{display:block;width:100%;height:680px;border:1px solid #dce6db;border-radius:12px;background:white}@media(max-width:650px){.compose-builder .compose-intro{padding:24px 20px}.compose-source-head strong{font-size:16px}}

.super-badge{display:inline-flex;background:#e3f2d2;color:#204b30;font-size:13px;font-weight:800;letter-spacing:.04em;border-radius:999px;padding:7px 12px}.compose-link{display:inline-flex;align-items:center;text-decoration:none;color:#214d33;border:1px solid #becdb9;border-radius:10px;padding:10px 14px;font-weight:700}.compose-generated .field{max-width:360px;margin:14px 0}.compose-generated select{min-height:44px;width:100%;padding:10px;border:1px solid #cbd5c5;border-radius:9px}@media(max-width:700px){.compose-actions>*{flex:1 1 100%;min-height:48px;text-align:center}.compose-generated iframe{height:68dvh;min-height:450px}}