@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700&family=Inter:wght@400;450;500;550;600;650;700&display=swap');
:root{font-family:Inter,Arial,sans-serif;color:#e2e5e4;background:#171b1e;font-synthesis:none;font-size:14px;--gold:#e5af70;--muted:#8d969a;--line:#333a3e;--surface:#202629;--panel:#1d2225}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:#292f32;border:1px solid #3a4145;color:#dfe3e3;padding:9px 12px;border-radius:5px;cursor:pointer;transition:background .15s,border-color .15s}button:hover{background:#363e42;border-color:#677074}button:disabled{opacity:.38;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:3px}button.primary{color:#211d17;background:var(--gold);border-color:var(--gold);font-weight:650}button.primary:hover{background:#f6c68b}button.icon{padding:8px;background:transparent;border:0}.app{height:100dvh;min-height:600px;display:flex;flex-direction:column}.topbar{height:76px;min-height:76px;display:flex;align-items:center;padding:0 24px;gap:40px;border-bottom:1px solid var(--line);background:#171c1f}.brand{display:flex;align-items:center;gap:11px;color:var(--gold);text-decoration:none;min-width:229px}.brand>span{font-family:'Barlow Condensed',Impact,sans-serif;font-size:26px;letter-spacing:2px;line-height:1}.brand-light{color:#e6e9e7;font-weight:500}.brand small{font:500 10px Inter,sans-serif;letter-spacing:3.4px;display:block;margin-top:8px;color:#8d969a}.project-title{display:flex;align-items:center;gap:12px;color:#d3d7d7;font-weight:500}.local-tag{margin-left:12px;font-size:11px;font-weight:500;letter-spacing:1px;border-left:1px solid #455056;padding-left:23px;color:var(--muted)}.top-actions{margin-left:auto;display:flex;gap:10px}.workspace{display:grid;grid-template-columns:272px minmax(340px,1fr) 298px;flex:1;min-height:0}.library,.inspector{background:var(--panel);display:flex;flex-direction:column;min-height:0}.library{border-right:1px solid var(--line)}.inspector{border-left:1px solid var(--line)}.panel-heading{display:flex;align-items:center;justify-content:space-between;padding:23px 20px 20px;gap:10px}.eyebrow{font-size:10px;letter-spacing:1.8px;color:#889295;font-weight:600}h2{font-size:19px;letter-spacing:-.5px;margin:8px 0 0;font-weight:550}h2>span{font-size:12px;color:#929b9e;margin-left:6px;font-weight:450}.folder-button{margin:0 20px 19px;background:transparent;border-style:dashed;padding:11px 7px;color:#c4cccd}.category-tabs{display:flex;flex-direction:column;padding:0 12px 14px;border-bottom:1px solid var(--line);gap:3px}.category-tabs button{background:transparent;border:0;justify-content:space-between;font-size:14px;padding:9px 12px;color:#9da7ac}.category-tabs button span{font-size:12px;color:#8a9598}.category-tabs button.active{background:#34332e;color:var(--gold)}.library-caption{font-size:12px;color:#829094;padding:17px 20px 12px}.asset-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 16px 20px;overflow:auto;align-content:start;flex:1}.asset-card{display:block;text-align:left;min-width:0;position:relative;background:#242b2e;border:1px solid #373f43;padding:0 0 10px;overflow:hidden}.asset-card.chosen{border-color:#ae885b}.asset-preview{height:86px;background:radial-gradient(ellipse at center,#384044,#252c30);display:flex;align-items:center;justify-content:center;color:#647277}.asset-preview img{width:100%;height:100%;object-fit:contain}.asset-preview>span{position:absolute;top:6px;right:7px;background:#171d20b3;border:1px solid #646862;color:#bfb8a2;border-radius:50%;font-size:12px;width:17px;height:17px;text-align:center;line-height:15px}.asset-card.chosen .asset-preview>span{background:var(--gold);color:#181a17;border-color:var(--gold)}.asset-card strong{font-size:12px;display:block;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:9px 9px 5px}.asset-card small{font-size:10px;display:block;padding:0 9px;color:#88969b}.library-bottom,.inspector-bottom{padding:15px 20px;border-top:1px solid var(--line);font-size:12px;color:#adb6b8;display:flex;align-items:center;gap:8px}.status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#a8b194;margin-right:7px}.stage{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 50% 40%,#465154 0,#313b3f 43%,#263035 78%,#242c30 100%)}.viewport-canvas{position:absolute;inset:0 0 106px}.viewport-canvas canvas{display:block;width:100%;height:100%;touch-action:none}.stage-heading{position:absolute;z-index:2;top:17px;left:23px;right:20px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.breadcrumb{font-size:10px;letter-spacing:1.4px;color:#c0c9cbb0;font-weight:500}.breadcrumb span{padding:0 11px;color:#788487}.stage-tools{display:flex;gap:4px;pointer-events:auto;background:#242c30a8;border-radius:5px}.view-label{position:absolute;top:70px;left:25px;z-index:1;pointer-events:none}.view-label>span{font-size:14px}.view-label small{display:block;font-size:11px;margin-top:7px;color:#9aa8ac}.view-controls{position:absolute;z-index:1;right:22px;bottom:156px;display:flex;border:1px solid #526065;border-radius:5px;overflow:hidden}.view-controls button{font-size:12px;border:0;border-radius:0;background:#263135;padding:8px 10px}.scale-label{position:absolute;bottom:164px;left:25px;color:#a4b0b2;font-size:11px}.scale-label span{display:block;font-size:25px;letter-spacing:20px}.stage-help{position:absolute;bottom:123px;width:100%;text-align:center;font-size:11px;color:#9daaae;pointer-events:none}.stage-help b{margin:0 8px;color:#64767d}.preset-strip{position:absolute;bottom:0;height:106px;left:0;right:0;display:flex;gap:8px;align-items:center;padding:16px 18px;background:#1b2225d9;border-top:1px solid #4d585b70;overflow-x:auto}.preset-strip button{min-width:138px;flex:1;justify-content:flex-start;height:69px;background:#242c30;border:1px solid #3b474c;padding:10px 12px}.preset-strip button.active{background:#39362d;border-color:#af8c5f;color:var(--gold)}.preset-strip svg{flex-shrink:0}.preset-strip strong{display:block;font-size:12px;white-space:nowrap;text-align:left;font-weight:550}.preset-strip small{display:block;font-size:10px;white-space:nowrap;text-align:left;color:#9da6a8;margin-top:7px}.inspector-scroll{flex:1;overflow-y:auto}.control-section{padding:20px;border-top:1px solid var(--line)}h3{margin:0 0 20px;font-size:14px;font-weight:550;display:flex;align-items:center;justify-content:space-between}h3 svg{color:#8a999e}.field-label{font-size:12px;color:#acb5b9;display:block;margin-bottom:9px}input:not([type=range]):not([type=checkbox]):not([type=color]),select{background:#161c20;color:#dce1e1;border:1px solid #3b454a;border-radius:4px;padding:9px 10px;min-width:0;width:100%}.seed-input{display:flex;background:#171e21;border:1px solid #465257;border-radius:5px;padding-right:4px;align-items:center}.seed-input input{border:0!important;font-family:monospace;letter-spacing:.6px}.seed-input button{color:#b5bdba}.generate-button{background:#d8a66d;color:#241e16;border-color:#d8a66d;width:100%;margin-top:11px;font-weight:600;padding:11px}.generate-button:hover{background:#ebbb80;color:#21190f}.slider{display:block;margin-top:19px}.slider>span{display:flex;justify-content:space-between;font-size:13px;color:#bfc7ca;margin-bottom:12px}.slider output{font-size:12px;color:#e0e2dc;font-variant-numeric:tabular-nums}input[type=range]{width:100%;height:4px;accent-color:var(--gold);cursor:pointer;display:block;margin:4px 0 8px}.swatches{display:flex;gap:8px}.swatches button{width:29px;height:29px;border:2px solid transparent;border-radius:50%;padding:0}.swatches button.active{outline:2px solid var(--gold);outline-offset:3px}.inspector-bottom{gap:11px}.inspector-bottom small{display:block;font-size:10px;color:#829296;margin-top:4px}.statusbar{height:30px;min-height:30px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;background:#171d20;border-top:1px solid var(--line);font-size:10px;color:#9eabad}.statusbar>span{display:flex;align-items:center;gap:5px}.statusbar b{font-weight:400;color:#5e7178;padding-left:6px}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-thumb{background:#4a555a;border-radius:6px}::-webkit-scrollbar-track{background:transparent}@media(min-width:1700px){.workspace{grid-template-columns:300px minmax(340px,1fr) 326px}.asset-preview{height:105px}}@media(max-width:1150px){.workspace{grid-template-columns:230px minmax(300px,1fr) 260px}.local-tag{display:none}.topbar{gap:20px;padding:0 16px}.brand{min-width:194px}.project-title{font-size:12px}.preset-strip button{min-width:130px}.panel-heading,.control-section{padding:18px 16px}.asset-grid{padding:0 12px 16px}.top-actions button{font-size:12px}}@media(max-width:850px){.app{height:auto;min-height:100dvh}.topbar{position:sticky;top:0;z-index:5;flex-wrap:wrap;height:auto;min-height:72px;padding:12px;gap:12px}.brand{min-width:170px}.project-title{display:none}.top-actions{gap:6px}.workspace{display:flex;flex-wrap:wrap}.stage{order:-1;width:100%;height:65dvh;min-height:490px}.library{width:45%;height:650px}.inspector{width:55%;height:650px}.statusbar{position:sticky;bottom:0;z-index:5;font-size:10px}.stage-help{font-size:10px}.top-actions button{padding:8px}.top-actions button svg{display:none}}
.project-title{min-width:120px;flex:1;gap:8px}.project-title input{border:0!important;background:transparent!important;padding:7px!important;max-width:185px}.local-tag{font-size:10px;white-space:nowrap;margin-left:0;padding-left:13px}.topbar{gap:20px}.top-actions{flex-shrink:0}.asset-main{display:block;width:100%;padding:0;text-align:left;border:0;border-radius:0;background:transparent}.asset-main:hover{background:#354045}.asset-card{padding-bottom:0}.place-asset{display:flex;border:0;border-top:1px solid #3a4449;border-radius:0;width:100%;background:#242d31;padding:6px;font-size:12px;color:#b5c0c4;margin-top:8px}.asset-card strong{font-size:13px}.asset-card small{font-size:12px}.asset-preview>span{top:7px;right:7px}.asset-preview{height:98px}.import-actions{display:flex;gap:8px;margin:0 17px 18px}.import-actions button{flex:1;padding:10px 7px;background:transparent;border-style:dashed;font-size:13px}.category-tabs{max-height:225px;overflow:auto;flex-shrink:0}.category-tabs button{flex-shrink:0;overflow:hidden}.library-filter{display:flex;margin:14px 17px 0;align-items:center;gap:8px;color:#88979e}.library-filter input{font-size:13px;padding:7px 8px!important}.library-caption{display:flex;align-items:center;justify-content:space-between;padding:11px 17px;font-size:12px}.library-caption button{padding:3px;border:0;background:transparent;font-size:12px;color:var(--gold)}.reference-button{font-size:13px;border:0;border-top:1px solid var(--line);border-radius:0;padding:13px;background:transparent}.empty-library{grid-column:1/-1;padding:40px 10px;text-align:center;color:var(--muted);font-size:14px}.inspector-tabs{display:flex;padding:0 12px 13px;gap:2px}.inspector-tabs button{flex:1;flex-direction:column;gap:8px;font-size:12px;background:transparent;border-color:transparent;padding:9px 5px}.inspector-tabs button.active{background:#34342e;border-color:#776044;color:var(--gold)}.hint{font-size:12px;line-height:1.65;color:#9ca9ad;margin:13px 0 0}.slider>span{font-size:14px}.slider output{font-size:13px}.field-label{font-size:14px}.eyebrow{font-size:11px}.control-section select{display:block;margin-top:11px;font-size:13px}.toggle{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:14px;line-height:1.5;margin:16px 0}.toggle small{display:block;font-size:12px;color:#9ba9ae;line-height:1.6;margin-top:6px}.toggle input{accent-color:var(--gold);width:17px;height:17px;flex-shrink:0}.color-field{display:flex;justify-content:space-between;align-items:center;margin-top:23px;font-size:14px}.color-field input{width:34px;height:26px;border:0;background:none;cursor:pointer}.vector-field{margin:18px 0}.vector-field>span{font-size:13px;color:#b5c0c5;display:block;margin-bottom:9px}.vector-field>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.vector-field label{position:relative}.vector-field small{position:absolute;top:9px;left:7px;color:#9da4a5;font-size:10px}.vector-field input{font-size:12px;padding:8px 3px 8px 20px!important}.piece-actions{display:flex;gap:7px;flex-wrap:wrap}.piece-actions button{flex:1;font-size:12px;padding:8px}.danger{color:#e9a794}.piece-list{display:flex;flex-direction:column;gap:4px}.piece-list>div{display:flex;border:1px solid transparent;border-radius:4px;background:#252e32}.piece-list>div.selected{border-color:#af8a5d;background:#39382f}.piece-name{min-width:0;flex:1;justify-content:flex-start;border:0;background:transparent;font-size:12px;padding:10px 6px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.piece-name span{font-size:11px;color:#8a9b9f;padding-right:3px}.piece-list .icon{padding:6px}.empty-selection{padding:10px 20px;font-size:14px;line-height:1.7;color:#a7b4b9}.transform-toolbar{position:absolute;z-index:2;top:112px;left:23px;display:flex;gap:4px;background:#222d31b3;padding:4px;border:1px solid #586265;border-radius:5px}.transform-toolbar button{padding:7px 9px;font-size:12px;border:0;background:transparent}.transform-toolbar button.active{background:#60523e;color:#f6d19b}.fused-toggle{position:absolute;bottom:201px;right:22px;z-index:2;background:#293a36;color:#c0d4c1;font-size:12px}.segmented{display:flex;gap:5px;margin-bottom:12px}.segmented button{flex:1;font-size:13px;background:transparent}.segmented button.active{color:var(--gold);border-color:#98784e;background:#39382f}.sketch-editor svg{width:100%;background:#192329;border:1px solid #4a5960;border-radius:5px;cursor:crosshair}.sketch-actions{display:flex;gap:5px;margin-top:8px}.sketch-actions button{flex:1;padding:7px 3px;font-size:12px;background:#293337}.busy-banner,.toast{position:fixed;bottom:48px;left:50%;transform:translateX(-50%);z-index:20;border:1px solid #877053;background:#252b2f;padding:15px 20px;border-radius:6px;display:flex;align-items:center;gap:12px;box-shadow:0 10px 40px #0006;max-width:min(650px,95vw);font-size:14px}.toast{border-color:#b26b47;color:#edd4b9;line-height:1.6}.toast svg{flex-shrink:0}.spin{animation:spin 1.6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.modal-backdrop{position:fixed;inset:0;background:#070d12bb;backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:30;padding:24px}.modal{background:#20292e;border:1px solid #4d5b61;border-radius:10px;padding:28px;width:min(580px,96vw);max-height:92dvh;overflow:auto;box-shadow:0 25px 100px #0009;outline:none}.modal.wide{width:min(1200px,96vw)}.modal-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.modal h2{font-size:25px;margin-top:9px}.modal-intro{font-size:14px;line-height:1.8;color:#c5cdcd;margin-bottom:22px}.modal select{margin-top:10px;font-size:14px}.modal-actions{display:flex;gap:10px;margin-top:25px;justify-content:flex-end}.modal-actions button{padding:12px 15px}.fusion-progress{padding:20px 0;font-size:14px;color:var(--gold)}.fusion-progress progress{display:block;width:100%;height:8px;margin-top:14px;accent-color:var(--gold)}.fusion-report{background:#1c322e;border:1px solid #45695b;padding:19px;margin-top:22px;border-radius:6px}.fusion-report h3{justify-content:flex-start;gap:9px;color:#c3dac7;font-size:15px}.fusion-report h3 svg{color:#aac4a7}.fusion-report dl{font-size:13px;margin:0}.fusion-report dl>div{display:flex;justify-content:space-between;gap:15px;border-top:1px solid #49625960;padding:10px 0}.fusion-report dt{color:#abc0b9}.fusion-report dd{margin:0;text-align:right;font-variant-numeric:tabular-nums}.warning{color:#ecc99f;font-size:13px;line-height:1.7}.export-error{display:flex;gap:12px;align-items:flex-start;padding:15px;background:#53382b;border:1px solid #9e6b46;border-radius:5px;line-height:1.7;font-size:14px;margin:18px 0}.export-error svg{flex-shrink:0;margin-top:2px}.reference-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.reference-grid figure{margin:0;background:#182126;border:1px solid #445057;border-radius:5px;overflow:hidden}.reference-grid img{width:100%;display:block;min-height:130px;object-fit:contain;background:#b2b1ad}.reference-grid figcaption{padding:15px;font-size:14px;color:#c7d0d2}.help-content{font-size:14px;line-height:1.8;color:#bbc7cb}.help-content ol{padding-left:20px}.help-content li{margin-bottom:18px}.help-content strong{color:#e7d0af}.preset-strip strong{font-size:13px}.preset-strip small{font-size:12px}.preset-strip button{min-width:155px}.stage-help{font-size:12px}.view-label small,.scale-label{font-size:12px}.statusbar{font-size:12px}.inspector-bottom small{font-size:12px}.library-bottom{font-size:12px}.breadcrumb{font-size:11px}.view-controls button{font-size:13px}.top-actions button{font-size:14px}@media(max-width:1300px){.local-tag{display:none}.topbar{gap:12px}.brand{min-width:229px}.stage-heading .breadcrumb{display:none}.stage-tools{margin-left:auto}.project-title input{max-width:165px}.top-actions{gap:6px}}@media(max-width:1150px){.brand{min-width:194px}.top-actions button{font-size:12px}.project-title input{max-width:145px}.import-actions button{font-size:12px}.preset-strip{padding-left:12px}.asset-grid{gap:8px}.modal-backdrop{padding:14px}}@media(max-width:850px){.top-actions .icon{padding:5px}.project-title{display:none}.brand{min-width:160px}.brand>span{font-size:24px}.top-actions button{font-size:12px}.top-actions .icon svg{display:block}.stage-tools{gap:1px}.stage-heading .breadcrumb{display:block}.breadcrumb{font-size:10px}.reference-grid{grid-template-columns:1fr}.modal{padding:20px}.modal-actions{flex-wrap:wrap}.modal-actions button{flex:1}.inspector-tabs{padding:0 6px 10px}.library-caption{flex-wrap:wrap;gap:6px}.vector-field>div{gap:3px}.category-tabs{max-height:170px}.library,.inspector{height:740px}.topbar{justify-content:space-between}.stage-help{font-size:10px}.preset-strip small{font-size:11px}.statusbar>span:first-child{max-width:80%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brand small{font-size:10px}.stage-tools .icon{padding:6px}}@media(prefers-reduced-motion:reduce){.spin{animation:none}*{transition:none!important}}@media(max-width:430px){.topbar{gap:6px}.brand{min-width:140px}.brand>span{font-size:21px}.brand svg{width:23px}.top-actions button{font-size:11px;padding:7px}.top-actions .icon{display:none}.asset-grid{grid-template-columns:1fr}.inspector-tabs button{font-size:11px}.library{width:40%}.inspector{width:60%}.stage-heading .breadcrumb{display:none}.library-caption{font-size:11px}.import-actions{flex-direction:column}.panel-heading{padding:17px 12px}h2{font-size:17px}}
/* Keep asset cards at their full preview height inside the scrollable library grid. */
.asset-grid{grid-auto-rows:minmax(180px,max-content);align-content:start}

.library-quality{flex-shrink:0;padding:12px 16px;border-bottom:1px solid var(--line)}.library-quality .hint{font-size:11px;margin:8px 0 0}.library-quality .field-label{margin:0 0 8px}.unfused-export{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}

.control-section .field-label input{width:100%;padding:9px;background:#172126;color:#dbe4e8;border:1px solid #3b484d;border-radius:4px}.sketch-actions{flex-wrap:wrap;gap:5px}.sketch-actions .active{border-color:#d9a66a;color:#e8bd87}.transform-toolbar kbd{font:10px monospace;opacity:.7}.piece-actions{flex-wrap:wrap}.control-section>button{margin:6px 0}.segmented button{min-width:0;padding:8px 5px}
/* Let the library scroll as a whole, so additional controls never collapse previews. */
.library{overflow-y:auto}.library>*{flex-shrink:0}.library .asset-grid{flex:0 0 auto;overflow:visible;min-height:180px}.category-tabs{max-height:170px;overflow-y:auto}.library-quality input[type=number]{width:100%;padding:8px;background:#172126;color:#dbe4e8;border:1px solid #3b484d;border-radius:4px}.library-quality .generate-button{margin-bottom:0}.top-actions{flex-shrink:0}.project-title{min-width:0}.piece-actions .generate-button{width:100%}
