:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#25262b;background:#f6f6f8;font-synthesis:none;--bg:#f6f6f8;--panel:#fff;--surface:#f1f1f5;--line:#e2e2ea;--ink:#25262b;--muted:#777781;--accent:#7868d9;--soft:#eeeafa;--shadow:0 18px 60px #24203912;color-scheme:light}
:root[data-theme=dark]{--bg:#17181c;--panel:#202126;--surface:#2a2b32;--line:#383943;--ink:#eeeef5;--muted:#a2a2b2;--accent:#b3a5ff;--soft:#343043;--shadow:0 18px 60px #0004;color-scheme:dark}
*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--ink)}button,input,select,textarea{font:inherit;color:inherit}button,a{touch-action:manipulation}button{background:transparent;border:0;cursor:pointer}button:disabled{opacity:.4;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}input,select,textarea{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px;min-width:0;width:100%;outline:0}input[type=range]{padding:0;accent-color:var(--accent);border:0}input[type=checkbox]{width:18px;height:18px;accent-color:var(--accent)}input[type=color]{width:42px;height:34px;padding:3px;border-radius:8px}a{color:var(--accent);text-decoration:none}.boot{display:flex;height:100%;align-items:center;justify-content:center;flex-direction:column}.boot b{font-size:24px}.boot small{color:var(--muted)}.boot p{font-size:13px}.studio{display:flex;flex-direction:column;height:100%;min-height:0}.topbar{height:76px;min-height:76px;display:flex;align-items:center;gap:8px;padding:0 24px;background:var(--panel);border-bottom:1px solid var(--line)}.brand{display:flex;gap:10px;align-items:center;margin-right:auto;min-width:140px}.brand-mark{background:#8071df;color:#fff;width:40px;height:40px;border-radius:12px;display:grid;place-items:center}.brand b{font-size:18px;letter-spacing:-.6px}.brand small{font-size:11px;color:var(--muted);display:block;margin-top:2px}.project-name{font-size:12px;color:var(--accent);background:var(--soft);padding:8px 12px;border-radius:8px;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.btn{display:inline-flex;gap:7px;align-items:center;justify-content:center;white-space:nowrap;padding:9px 11px;border-radius:9px;font-size:12px;border:1px solid transparent;color:var(--ink)}.btn:hover{background:var(--surface)}.btn.active{background:var(--soft);color:var(--accent)}.btn.primary{background:#8071df;color:white}.btn.primary:hover{background:#7060d3}.btn.outlined{border-color:var(--line)}.btn svg,.symbol{width:18px;height:18px;flex-shrink:0}.workspace{display:grid;grid-template-columns:262px minmax(0,1fr) 306px;min-height:0;flex:1}.library,.inspector{background:var(--panel);min-width:0;min-height:0;display:flex;flex-direction:column}.library{border-right:1px solid var(--line)}.inspector{border-left:1px solid var(--line)}.side-title{height:56px;min-height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;font-size:13px;font-weight:600}.side-title small{font-size:10px;color:var(--muted);font-weight:400}.library-controls{padding:0 14px 12px;display:grid;gap:10px}.search-field{position:relative}.search-field input{padding-right:30px;font-size:12px}.search-field button{position:absolute;right:6px;top:7px;color:var(--muted)}.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);padding-bottom:7px}.tabs button{font-size:11px;padding:7px;flex:1;border-radius:6px;color:var(--muted)}.tabs button.active{background:var(--soft);color:var(--accent)}.count{font-size:11px;color:var(--muted);display:flex;justify-content:space-between}.library-grid{padding:0 12px 12px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;align-content:start;overflow:auto;flex:1;min-height:0}.icon-card{position:relative;min-width:0;display:flex;flex-direction:column;align-items:center;gap:8px;padding:13px 6px 9px;border:1px solid var(--line);border-radius:12px;background:var(--surface);height:91px}.icon-card:hover{border-color:var(--accent);background:var(--soft)}.icon-card img{width:34px;height:34px;object-fit:contain}.icon-card span{font-size:10px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.icon-card .favorite{position:absolute;right:2px;top:2px;font-size:12px;color:var(--muted);opacity:0}.icon-card:hover .favorite,.icon-card .favorite.saved{opacity:1}.library-footer{border-top:1px solid var(--line);padding:12px;display:flex;align-items:center;justify-content:space-between;gap:6px}.center{min-width:0;min-height:0;display:flex;flex-direction:column}.center-toolbar{min-height:47px;display:flex;align-items:center;gap:6px;padding:0 18px;border-bottom:1px solid var(--line);font-size:11px;color:var(--muted)}.center-toolbar strong{color:var(--ink);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-right:auto}.viewport{min-height:140px;flex:1;overflow:auto;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:22px 14px;gap:14px;background:radial-gradient(ellipse at center,var(--panel),var(--bg))}.viewport.checker{background-image:conic-gradient(var(--surface) 25%,var(--bg) 0 50%,var(--surface) 0 75%,var(--bg) 0);background-size:24px 24px}.artwork{width:min(330px,65%,42vh);max-height:calc(100% - 118px);aspect-ratio:1;display:flex;align-items:center;justify-content:center;flex-shrink:1;min-height:60px}.artwork img{width:100%;height:100%;object-fit:contain;user-select:none}.icon-name{display:flex;gap:8px;align-items:center;font-size:14px}.preview-actions,.resolve-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px}.preview-actions{background:var(--panel);border:1px solid var(--line);border-radius:24px;padding:3px 7px}.preview-actions .btn{font-size:11px}.resolve-actions .btn{background:var(--soft);color:var(--accent)}.viewport-controls{display:flex;justify-content:space-between;padding:8px 16px;border-top:1px solid var(--line);background:var(--bg);gap:8px}.collection{height:172px;min-height:120px;max-height:34%;border-top:1px solid var(--line);background:var(--panel);display:flex;flex-direction:column}.collection-header{display:flex;gap:6px;align-items:center;padding:10px 14px;font-size:12px;min-height:42px;flex-wrap:wrap}.collection-header strong{margin-right:auto}.badge{font-size:10px;color:var(--muted);background:var(--surface);padding:2px 5px;border-radius:4px}.collection-strip{display:flex;gap:9px;padding:0 14px 12px;overflow:auto;flex:1;min-height:0}.collection-card{min-width:90px;width:90px;padding:7px;position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}.collection-card.active{border-color:var(--accent);background:var(--soft)}.collection-card img{width:64px;height:64px;object-fit:contain}.collection-card>span{font-size:10px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;max-width:100%}.collection-card .select{position:absolute;top:4px;right:4px;font-size:12px;color:var(--accent);border:1px solid var(--line);width:17px;height:17px;border-radius:4px;background:var(--panel)}.inspector-tabs{padding:0 14px 12px;display:flex;gap:8px;border-bottom:1px solid var(--line)}.inspector-tabs .btn{flex:1}.inspector-scroll{padding:14px;display:grid;gap:12px;overflow:auto;align-content:start;flex:1}.group{padding:16px;background:var(--surface);border:1px solid var(--line);border-radius:14px;min-width:0}.group h3{font-size:12px;margin:0 0 16px;font-weight:600;border-bottom:1px solid var(--line);padding-bottom:11px}.segments{display:flex;gap:3px;background:var(--bg);padding:3px;border:1px solid var(--line);border-radius:9px;margin-bottom:12px}.segments button{flex:1;padding:7px 3px;font-size:10px;border-radius:6px;color:var(--muted)}.segments button.active{background:var(--soft);color:var(--accent)}.field{display:flex;gap:8px;align-items:center;justify-content:space-between;font-size:11px;margin:12px 0;min-width:0}.field .value{color:var(--muted);font-size:10px}.field select{max-width:145px;font-size:11px}.field input:not([type=checkbox]):not([type=color]):not([type=range]){max-width:150px}.color-row{display:flex;gap:7px;align-items:center;margin:8px 0}.color-row input[type=text]{font-size:11px;flex:1}.palette-title{font-size:10px;color:var(--muted);margin:14px 0 9px}.palette{display:grid;grid-template-columns:repeat(auto-fit,minmax(24px,1fr));gap:6px;min-width:0}.swatch{aspect-ratio:1;min-width:0;border-radius:7px;max-height:30px;border:1px solid #8883}.swatch:hover{outline:2px solid var(--accent);outline-offset:2px}.group details{border-top:1px solid var(--line);margin-top:14px;padding-top:12px}.group summary{font-size:11px;color:var(--muted);cursor:pointer}.inspector-footer{padding:9px 12px;border-top:1px solid var(--line);display:flex;gap:4px}.inspector-footer .btn{font-size:11px}.modal-backdrop{position:fixed;inset:0;background:#08091385;display:flex;align-items:center;justify-content:center;z-index:100;padding:18px;backdrop-filter:blur(7px)}.modal{max-height:90vh;max-width:680px;width:100%;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:18px;background:var(--panel);box-shadow:var(--shadow);overflow:hidden}.modal-header{padding:16px 20px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px}.modal-header h2{margin:0;font-size:16px;font-weight:600;flex:1}.modal-content{padding:18px 20px;overflow:auto;display:grid;gap:14px;min-height:0}.modal-content h3{margin:0;font-size:12px}.modal-actions{display:flex;flex-wrap:wrap;gap:7px;padding-top:6px}.search-modal{max-width:630px}.search-modal .modal-header input{background:transparent;border:0;font-size:16px;padding:0}.quick-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.quick-grid .icon-card{height:94px}.quick-grid .focused{border-color:var(--accent);outline:2px solid var(--soft)}.search-status{font-size:11px;color:var(--muted);display:flex;justify-content:space-between}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-grid label{display:grid;gap:6px;font-size:11px}.form-grid .wide{grid-column:1/-1}.rename-preview{width:100%;font-size:11px;border-collapse:collapse}.rename-preview td{padding:7px;border-bottom:1px solid var(--line);max-width:240px;overflow:hidden;text-overflow:ellipsis}.rename-preview td:last-child{color:var(--accent)}.looks-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px}.look-card{padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--surface);display:grid;gap:7px;position:relative}.look-card img{width:70px;height:70px;justify-self:center}.look-card span{font-size:11px;text-align:center}.look-card .delete{position:absolute;right:3px;top:3px;color:var(--muted)}.folder-row{display:flex;align-items:center;gap:8px;padding:10px;border:1px solid var(--line);border-radius:9px}.folder-row span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:11px;color:var(--muted)}.pack-list{display:grid;gap:5px;max-height:230px;overflow:auto}.pack-row{display:flex;gap:8px;align-items:center;padding:8px;border:1px solid var(--line);border-radius:8px;font-size:11px}.pack-row label{flex:1;display:flex;gap:8px;align-items:center}.pack-row small{color:var(--muted);font-size:10px}.progress{font-size:11px;color:var(--muted)}.toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);padding:12px 17px;border-radius:10px;background:var(--ink);color:var(--panel);box-shadow:var(--shadow);z-index:200;font-size:12px;max-width:90vw;display:flex;gap:16px}.toast button{color:inherit}.drawer-close{display:none}.drop-hint{position:fixed;inset:8px;background:var(--soft);border:2px dashed var(--accent);z-index:150;border-radius:16px;display:grid;place-items:center;font-size:18px;pointer-events:none}.muted{font-size:11px;color:var(--muted)}.empty{padding:28px 12px;text-align:center;font-size:12px;color:var(--muted);grid-column:1/-1}.license-info{font-size:10px;color:var(--muted);padding:6px 0}.compact-toggle{display:none}details[open] summary{margin-bottom:12px}*{scrollbar-width:thin;scrollbar-color:var(--line) transparent}
@media(min-width:1450px){.workspace{grid-template-columns:300px minmax(0,1fr) 350px}.library-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1150px){.topbar{padding:0 14px;height:64px;min-height:64px}.topbar .btn .label{display:none}.project-name{max-width:150px}.workspace{grid-template-columns:218px minmax(0,1fr) 274px}.group{padding:13px}.topbar .btn{padding:8px}.library-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.artwork{width:min(280px,72%,38vh)}}
@media(max-width:950px){.workspace{grid-template-columns:minmax(0,1fr) 274px}.library{display:none}.library.open{display:flex;position:fixed;left:0;top:64px;bottom:0;width:260px;z-index:50;box-shadow:var(--shadow)}.compact-toggle,.drawer-close{display:inline-flex}.brand{min-width:125px}.project-name{display:none}.collection-header .btn .label{display:none}.preview-actions .btn .label{display:none}.resolve-actions .btn .label{display:none}.artwork{width:min(280px,76%,38vh)}}
@media(max-width:700px){.workspace{grid-template-columns:minmax(0,1fr)}.inspector{display:none}.inspector.open{display:flex;position:fixed;right:0;top:60px;bottom:0;width:min(310px,90vw);z-index:50;box-shadow:var(--shadow)}.topbar{padding:0 10px;height:60px;min-height:60px;gap:1px}.topbar .btn{padding:7px}.brand{gap:6px;min-width:112px}.brand-mark{width:30px;height:30px;border-radius:9px}.brand b{font-size:15px}.brand small{font-size:9px}.topbar .download-script{display:none}.library.open{top:60px}.center-toolbar{padding:0 10px;min-height:39px}.viewport{gap:9px;padding:10px}.artwork{width:min(275px,75%,40vh)}.viewport-controls{padding:6px 10px}.collection{height:143px}.collection-header{padding:6px 10px}.collection-strip{padding:0 10px 8px}.collection-card{min-width:78px;width:78px}.collection-card img{width:54px;height:54px}.btn{padding:8px;font-size:11px}.quick-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.modal{max-height:94vh}.modal-backdrop{padding:9px}.modal-content{padding:14px}.modal-header{padding:14px}.form-grid{gap:9px}.icon-card span{font-size:9px}.collection-header .label{display:none}}
@media(max-height:580px){.viewport{gap:6px;padding:8px}.icon-name{font-size:11px}.artwork{width:min(200px,65%,35vh)}.collection{height:125px;min-height:90px}.preview-actions .btn{padding:6px}.center-toolbar{min-height:35px}.topbar{height:56px;min-height:56px}.viewport-controls{padding:4px 10px}.resolve-actions .btn{padding:6px}.collection-card img{height:44px;width:44px}}