.particle-modal{width:min(1160px,calc(100vw - 28px));max-width:none;overflow:hidden}.particle-modal .particle-heading{padding:23px 27px 21px;display:flex;align-items:center;justify-content:space-between;gap:20px;background:#f7f7eb;border-bottom:1px solid #d3dac4}.particle-heading h1{font-size:26px;margin:8px 0 7px;letter-spacing:-.7px;color:#4c6140}.particle-heading p{font-size:12px;color:#8a967b;line-height:1.7;margin:0}.particle-heading .button{font-size:11px;white-space:nowrap;min-height:36px}.particle-studio{display:grid;grid-template-columns:185px minmax(0,1fr);height:min(650px,calc(100dvh - 238px));min-height:320px}.particle-library{padding:19px 12px;border-right:1px solid #d2dac1;background:#eef2e3;overflow:auto}.particle-library>.section-label{font-size:8px;display:flex;justify-content:space-between;padding:0 4px 13px}.particle-library>.section-label span{color:#9aaa89;letter-spacing:0}.particle-list-item{display:flex;align-items:center;gap:9px;text-align:left;width:100%;padding:10px 8px;background:transparent;border:1px solid transparent;border-radius:4px;margin-bottom:4px}.particle-list-item.active{border-color:#aebe91;background:#dce8ca}.particle-list-item:hover{background:#e2ebd3}.particle-list-icon{display:grid;place-items:center;flex-shrink:0;width:25px;height:30px;font-size:23px;color:#7a8c66;background:#fbfaec;border:1px solid #cad4b8;box-shadow:inset 0 -4px var(--effect-color)}.particle-list-item>span:nth-child(2){min-width:0}.particle-list-item strong{display:block;font-size:11px;color:#596e46;overflow-wrap:anywhere}.particle-list-item small{font-size:8px;color:#91a27b;margin-top:5px;display:block}.particle-list-item i{width:5px;height:5px;border-radius:50%;background:#b8bbae;margin-left:auto;flex-shrink:0}.particle-list-item i.on{background:#91ac6b}.particle-library>p{font-size:10px;line-height:1.8;color:#919d81;padding:12px 5px 0}.particle-library>.text-button{font-size:9px;text-align:left;margin-top:6px;line-height:1.7}.particle-list-empty{padding:23px 5px;text-align:center;color:#9cad87;font-size:37px}.particle-list-empty strong{font-size:12px;color:#7e9169;display:block;margin:12px 0}.particle-list-empty p{font-size:10px;line-height:1.8}.particle-workspace{min-width:0;background:#fafaf1;overflow:auto}.particle-working{height:100%;display:grid;grid-template-columns:minmax(255px,1fr) 290px}.particle-preview-column{padding:20px 20px 18px;min-width:0;overflow:auto}.particle-preview-frame{border:1px solid #b9c8a3;border-radius:4px;overflow:hidden;box-shadow:3px 3px #cbd5b522;background:#e0e8d0}.particle-preview-title{display:flex;justify-content:space-between;padding:10px;font:8px var(--mono);color:#7d9168;gap:10px}.particle-preview-title>span:last-child{font-size:7px;color:#96a484}.particle-preview-frame canvas{display:block;width:100%;height:auto;aspect-ratio:16/9;image-rendering:pixelated;cursor:crosshair;background:#263b35}.particle-preview-actions{display:flex;align-items:center;justify-content:space-between;padding:10px 9px;gap:6px}.particle-preview-actions button{font-size:9px;padding:0;background:transparent;color:#758c5c;white-space:nowrap}.particle-preview-options{display:flex;gap:9px;flex-wrap:wrap;margin:15px 0}.particle-preview-options label{font-size:9px;display:flex;align-items:center;gap:4px;margin:0;color:#8c9b7b}.particle-preview-options input{width:11px;height:11px;accent-color:#7c9561;margin:0}.particle-preview-note{font-size:10px;line-height:1.8;color:#71885a;margin:13px 0 9px}.particle-demo-note{font-size:9px;line-height:1.7;color:#a2ab95}.particle-block-tip{display:flex;gap:12px;margin-top:25px;border:1px dashed #c5d0b2;border-radius:3px;background:#f0f4e5;padding:14px}.particle-block-tip>span{font-size:24px;color:#9ba991}.particle-block-tip strong{font-size:10px;color:#839572}.particle-block-tip p{font-size:10px;line-height:1.8;color:#9daa8e;margin:7px 0 0}.particle-properties{border-left:1px solid #d4dcc5;overflow:auto;min-width:0;background:#f6f7ed;padding:19px 18px}.particle-property-heading>.section-label{font-size:8px;margin-bottom:16px;display:block}.particle-field{display:block;margin:13px 0;font-size:10px;color:#7f9169;line-height:1.5;min-width:0}.particle-field input:not([type=range]),.particle-field select{display:block;width:100%;height:32px;margin-top:6px;font:11px var(--sans);padding:5px 8px;border:1px solid #cbd5ba;border-radius:3px;color:#6f8558;background:#fffef5;box-shadow:none;min-width:0}.particle-range{position:relative}.particle-range output{float:right;font:10px var(--mono);color:#a5b090}.particle-range input[type=range]{width:100%;margin:8px 0 0;height:13px;accent-color:#8ba86b}.particle-check{font-size:10px;color:#82966b;display:flex;gap:7px;align-items:center;margin:13px 0;line-height:1.7}.particle-check input{width:13px;height:13px;flex-shrink:0;accent-color:#87a461;margin:0}.particle-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.particle-two .particle-field{margin-top:8px;margin-bottom:8px}.particle-section{border-top:1px solid #d4ddc3;margin-top:17px;padding-top:13px}.particle-section summary{cursor:pointer;font-size:11px;color:#6d8654;line-height:1.7;padding-bottom:4px;font-weight:600}.particle-section summary small{display:inline;font-size:8px;font-weight:400;margin-left:4px;color:#a5b094}.particle-field-note,.particle-field-warning{font-size:9px;line-height:1.75;color:#9ba88d;margin:5px 0 10px}.particle-field-warning{padding:8px;background:#f4e8cb;color:#a69263;border-radius:3px}.particle-colors{margin:13px 0}.particle-colors>label{display:block;font-size:10px;color:#7e916b;margin:0 0 7px}.particle-colors>div{display:flex;gap:5px;flex-wrap:wrap}.particle-colors>div>span{display:flex;align-items:center;flex-direction:column}.particle-colors input[type=color]{width:27px;height:27px;min-height:0;padding:2px;border:1px solid #c8d3b8;border-radius:3px;background:#fffef2;box-shadow:none;cursor:pointer}.particle-colors span>button{padding:1px 5px;font-size:10px;background:none;color:#a2ad97}.particle-colors small{display:block;font-size:8px;color:#a1ad92;line-height:1.7;margin:5px 0 0}.particle-colors #particle-add-color{width:26px;height:27px;font-size:14px;background:#e7eddc;border:1px dashed #b8c7a1;color:#8b9f77;border-radius:3px}.particle-edit-actions{border-top:1px solid #d4ddc3;padding-top:17px;display:flex;justify-content:space-between;gap:12px;margin-top:18px}.particle-edit-actions button{background:none;font-size:10px;color:#8a9c73;padding:0}.particle-edit-actions .danger-text{color:#b38f85}.particle-id{font:7px var(--mono);color:#a7b297;margin:17px 0 0;line-height:1.8}.particle-id code{display:block;overflow-wrap:anywhere;font-size:8px;color:#8fa37b}.particle-footer{display:flex;justify-content:space-between;align-items:center;padding:14px 22px;border-top:1px solid #cfd8bb;background:#f0f3e4;gap:20px}.particle-footer>span{font-size:10px;color:#9ca98b}.particle-footer .button{min-height:34px;font-size:11px;padding:0 22px}.particle-presets{padding:23px}.particle-picker-heading{display:flex;gap:20px;align-items:flex-start;justify-content:space-between;margin-bottom:23px}.particle-picker-heading h2{font-size:20px;line-height:1.4;margin:0 0 7px;letter-spacing:-.4px;color:#6a8153}.particle-picker-heading p{font-size:11px;line-height:1.7;color:#9aaa8b;margin:0}.particle-picker-heading>button{font-size:23px;color:#a0ae8b}.particle-preset-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.particle-preset-grid>button{padding:16px 15px;border:1px solid #d6ddc7;border-radius:4px;background:#f3f5e9;text-align:left;transition:background .15s,border-color .15s}.particle-preset-grid>button:hover{background:#e6eed7;border-color:#a7ba8c}.particle-preset-icon{display:grid;place-items:center;font-size:29px;height:42px;width:43px;margin-bottom:12px;color:#b8a374;background:#eee8d5;border:1px solid #dcd4ba;border-radius:4px}.particle-preset-icon.rain,.particle-preset-icon.bubbles,.particle-preset-icon.snow{background:#e1ebef;border-color:#c1d1d7;color:#87a9bb}.particle-preset-icon.magic,.particle-preset-icon.trail,.particle-preset-icon.smoke{background:#e7e3ee;border-color:#cfc7dc;color:#a192b6}.particle-preset-icon.fire,.particle-preset-icon.explosion,.particle-preset-icon.sparks{background:#f1e2d4;border-color:#dfc9b6;color:#ca9670}.particle-preset-icon.confetti{background:#ede2e5;border-color:#d6c5cb;color:#b493a2}.particle-preset-grid strong{display:block;font-size:12px;color:#78935d}.particle-preset-grid small{font-size:10px;display:block;color:#9aaa89;line-height:1.7;margin-top:6px}.particle-effects-entry{width:100%;font-size:11px;margin:0 0 17px;min-height:37px;background:#e9edda;color:#7e925f;border-color:#becba6}
@media(max-width:1000px){.particle-studio{grid-template-columns:160px minmax(0,1fr)}.particle-working{grid-template-columns:minmax(220px,1fr) 250px}.particle-preview-column{padding:17px 14px}.particle-properties{padding:16px 14px}.particle-preset-grid{gap:8px}.particle-preset-grid>button{padding:13px}.particle-heading h1{font-size:23px}}
@media(max-width:800px){.particle-studio{height:min(710px,calc(100dvh - 220px));grid-template-columns:135px minmax(0,1fr)}.particle-working{display:block;height:auto}.particle-preview-column{overflow:visible}.particle-properties{border-left:0;border-top:1px solid #d4dcc5;overflow:visible}.particle-block-tip{display:none}.particle-preview-options{margin:12px 0}.particle-preview-note{margin-bottom:0}.particle-demo-note{margin-bottom:0}.particle-preset-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.particle-list-item{gap:7px;padding:9px 5px}.particle-list-item strong{font-size:10px}.particle-list-item small{font-size:7px}.particle-list-icon{width:21px;height:26px;font-size:19px}.particle-library{padding:15px 7px}.particle-library>.section-label{font-size:7px;letter-spacing:0}.particle-heading p{font-size:11px}.particle-modal .particle-heading{padding:20px}.particle-field input:not([type=range]),.particle-field select{font-size:13px;height:36px}.particle-section summary{font-size:12px}.particle-two{gap:14px}}
@media(max-width:480px){.particle-modal{width:calc(100vw - 16px)}.particle-modal .particle-heading{padding:16px;display:block}.particle-heading h1{font-size:22px}.particle-heading .button{margin-top:13px;min-height:33px;font-size:10px}.particle-heading p{font-size:10px}.particle-studio{display:block;height:calc(100dvh - 284px);min-height:240px;overflow:auto}.particle-library{border-right:0;border-bottom:1px solid #d2dac1;padding:11px 13px;overflow:visible}.particle-library>p,.particle-library>.text-button,.particle-library>.section-label{display:none}#particle-list{display:flex;gap:7px;overflow-x:auto}.particle-list-item{width:145px;flex-shrink:0;margin:0;padding:6px}.particle-list-empty{font-size:18px;padding:0;display:flex;align-items:center;gap:10px}.particle-list-empty strong{margin:0;font-size:11px}.particle-list-empty p{display:none}.particle-workspace{overflow:visible}.particle-preview-column{padding:14px}.particle-preview-actions button{font-size:10px}.particle-preview-options label{font-size:9px}.particle-presets{padding:16px}.particle-picker-heading h2{font-size:17px}.particle-picker-heading p{font-size:10px}.particle-picker-heading{margin-bottom:16px}.particle-preset-grid small{font-size:9px}.particle-preset-grid strong{font-size:11px}.particle-preset-icon{margin-bottom:10px;height:34px;width:34px;font-size:24px}.particle-footer{padding:12px 15px;gap:10px}.particle-footer>span{font-size:8px;line-height:1.7}.particle-footer .button{font-size:10px;min-height:32px;padding:0 17px}.particle-properties{padding:16px}.particle-field input:not([type=range]),.particle-field select{font-size:16px}.particle-two .particle-field input{font-size:14px}}
/* Keep the title and Done button in view; only the work areas scroll. */
.particle-light-settings{background:#f1f0dd;border:1px solid #d5d6b7;border-radius:5px;padding:12px!important;margin-bottom:15px}.particle-light-looks{display:flex;flex-wrap:wrap;gap:5px;margin:12px 0 16px}.particle-light-looks button{padding:7px 8px;border:1px solid #c4c9a7;border-radius:4px;background:#fffced;color:#617247;font-size:9px}.particle-light-looks button:hover{background:#ecdfae}.particle-light-settings .button{font-size:10px;line-height:1.5;padding:9px;white-space:normal;width:100%}.particle-preset-icon.light{background:#fff0bd;color:#a98637;box-shadow:0 0 20px #edce7340}.particle-properties [hidden]{display:none!important}
#modal:has(.particle-modal){overflow:hidden;max-height:calc(100dvh - 28px)}
.particle-modal{display:flex;flex-direction:column;width:min(1160px,calc(100vw - 36px));max-height:calc(100dvh - 36px)}
.particle-modal>.modal-title,.particle-heading,.particle-footer{flex-shrink:0}
.particle-studio{flex:1;min-height:0}
@media(max-width:480px){.particle-modal{width:calc(100vw - 28px);max-height:calc(100dvh - 36px)}}