@vieda/editor 0.1.0 → 0.1.2

package/dist/assets/index-a0bvhYyU.css

@@ -0,0 +1 @@
+*,*:before,*:after{box-sizing:border-box}*{margin:0;padding:0}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}button,[type=button],[type=reset],[type=submit]{-moz-appearance:none;appearance:none;-webkit-appearance:none;background:none;border:none;color:inherit;cursor:pointer;padding:0}a{color:inherit;text-decoration:none}ul,ol{list-style:none}table{border-collapse:collapse;border-spacing:0}fieldset{border:none;padding:0}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}h1,h2,h3,h4,h5,h6{text-wrap:balance}:root{--base-font-size: 12px;--brand-color: #7c5cff;--brand-color-soft: rgba(125 92 255 / .3);--input-padding: 4px 10px;--input-border-radius: 10px;--input-corner-shape: squircle;--caret-size: 9px;--field-gap: 6px;--panel-title-font-size: 12px;--panel-title-font-weight: 500;--panel-title-color: var(--text);--panel-title-text-transform: normal;--panel-title-letter-spacing: 0;--row-margin-bottom: 10px;--panel-width: 250px}@supports not (corner-shape: var(--input-corner-shape)){:root{--input-border-radius: 6px}}:root,[data-theme=dark]{--bg: #1e1f24;--panel: #2b2b2b;--panel-border: #3f3f3f;--text: #e4e5e9;--text-dim: #9a9ba3;--accent: var(--brand-color);--accent-soft: var(--brand-color-soft);--canvas-bg: #171717;--canvas-dot: #272727;--control-bg: #373737;--control-hover: #535353;--input-bg: #1e1e1e;--input-text: #e5e5e5;--row-hover: #404040;--badge-bg: #4a3a78;--badge-text: #cdb9ff;--prop-bg: #21424b;--prop-text: #7fd6e8;--danger: #ff8080;--warn-bg: #55452a;--warn-text: #e8c87f;--scrollbar-track: var(--panel);--scrollbar-thumb: #454545;--scrollbar-thumb-hover: #505050}[data-theme=light]{--bg: #efefef;--panel: #ffffff;--panel-border: #d4d5db;--text: #4e4e4e;--text-dim: #6b6c75;--accent: var(--brand-color);--accent-soft: var(--brand-color-soft);--canvas-bg: #e1e1e1;--canvas-dot: #c8c8c8;--control-bg: #f5f5f5;--control-hover: #dcdcdc;--input-bg: #f5f5f5;--input-text: #4a4a4a;--row-hover: #e8e9ee;--badge-bg: #e8e0ff;--badge-text: #5a3fd4;--prop-bg: #d8f0f5;--prop-text: #1a7a8c;--danger: #d93030;--warn-bg: #f5e7c0;--warn-text: #7d5f10;--scrollbar-track: var(--panel);--scrollbar-thumb: #cecece;--scrollbar-thumb-hover: #b9b9b9}html,body,#root{margin:0;height:100%;font-size:16px}body{font-family:-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.2;-webkit-font-smoothing:antialiased;color:var(--text);background:var(--bg)}.app{display:flex;flex-direction:column;height:100%}.splash{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:8px;color:var(--text-dim)}.splash.error pre{background:var(--panel);padding:12px 16px;border-radius:6px;color:var(--danger)}.topbar{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--panel);border-bottom:1px solid var(--panel-border)}.logo{font-weight:400;font-size:18px;color:var(--accent);letter-spacing:1px}.spacer{flex:1}.mode-switch{display:flex;margin-left:12px;border:1px solid var(--panel-border);border-radius:5px;overflow:hidden}.topbar .mode-switch button{background:none;border:none;border-radius:0;padding:4px 12px;color:var(--text-dim)}.topbar .mode-switch button.active{background:var(--control-bg);color:var(--text)}.toggle-switch{display:inline-flex;align-items:center;gap:6px;color:var(--text-dim);cursor:pointer;-webkit-user-select:none;user-select:none}.toggle-switch.on{color:var(--text)}.toggle-switch input{position:absolute;opacity:0;pointer-events:none}.toggle-switch-track{width:26px;height:14px;border-radius:7px;background:var(--control-bg);border:1px solid var(--panel-border);position:relative;transition:background .15s ease}.toggle-switch-track:after{content:"";position:absolute;top:1px;left:1px;width:10px;height:10px;border-radius:50%;background:var(--text-dim);transition:transform .15s ease,background .15s ease}.toggle-switch.on .toggle-switch-track{background:var(--accent);border-color:var(--accent)}.toggle-switch.on .toggle-switch-track:after{transform:translate(12px);background:#fff}.toggle-switch input:disabled{cursor:not-allowed}.toggle-switch:has(input:disabled){opacity:.5;cursor:not-allowed}.toggle-switch input:focus-visible+.toggle-switch-track{outline:2px solid var(--accent-soft);outline-offset:1px}.status{color:var(--text-dim)}.sync-badge{font-size:var(--base-font-size);padding:2px 8px;border-radius:10px;background:var(--badge-bg);color:var(--badge-text);white-space:nowrap;cursor:default}.sync-badge.modified{background:var(--warn-bg);color:var(--warn-text)}.user-menu{position:relative;display:flex}.topbar .avatar-btn{width:26px;height:26px;padding:0;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:var(--base-font-size)}.popdown{position:absolute;top:calc(100% + 6px);left:0;min-width:180px;padding:8px;display:flex;flex-direction:column;gap:8px;background:var(--panel);border:1px solid var(--panel-border);border-radius:6px;box-shadow:0 6px 20px #00000040;z-index:100}.popdown-user{font-size:var(--base-font-size);color:var(--text);padding:2px 4px}.muted-line{font-size:11px;color:var(--text-dim)}.popdown button{background:var(--control-bg);color:var(--text);border:1px solid var(--panel-border);border-radius:5px;padding:4px 10px;font-size:var(--base-font-size);cursor:pointer}.project-list{display:flex;flex-direction:column;gap:6px;max-height:300px;overflow-y:auto}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background:#00000080;display:flex;align-items:center;justify-content:center}.topbar button,.panel-section button{background:var(--control-bg);color:var(--text);border:1px solid var(--control-bg);border-radius:var(--input-border-radius);corner-shape:var(--input-corner-shape);padding:4px 10px;font-size:var(--base-font-size);cursor:pointer}button:hover:not(:disabled){background:var(--control-hover);border-color:var(--control-hover)}button:disabled{opacity:.4;cursor:default}button.primary{background:var(--accent);border-color:var(--accent);color:#fff}button.wide{width:100%;margin-top:6px}input,select,textarea{background:var(--input-bg);border:1px solid var(--input-bg);color:var(--input-text);border-radius:var(--input-border-radius);corner-shape:var(--input-corner-shape);padding:var(--input-padding);font-size:var(--base-font-size);font-family:inherit;width:100%;min-width:0}select{padding-right:20px}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}input[type=checkbox]{width:auto}input.unit-invalid{border-color:var(--danger)}input[type=color]{flex:none;width:24px;height:24px;padding:0;overflow:hidden;cursor:pointer;border:4px solid var(--input-bg)}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:none;border-radius:inherit;corner-shape:inherit}input[type=color]::-moz-color-swatch{border:none;border-radius:inherit}input:focus,select:focus,textarea:focus{outline:1px solid var(--accent)}.panel-section .remove-button{align-self:stretch;border:none;padding:0 8px;font-family:ui-monospace,monospace;font-size:12px;font-weight:700;color:var(--text-dim);cursor:pointer;border-radius:100px;display:inline-flex;align-items:center;justify-content:center;corner-shape:var(--input-corner-shape)}.panel,.topbar{font-size:var(--base-font-size);font-family:-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif!important}.workspace{display:flex;flex:1;min-height:0}.panel{width:var(--panel-width);background:var(--panel);display:flex;flex-direction:column;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb) var(--scrollbar-track)}.panel::-webkit-scrollbar{width:8px}.panel::-webkit-scrollbar-track{background:var(--scrollbar-track)}.panel::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border:2px solid var(--scrollbar-track);border-radius:999px}.panel::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover)}.panel.layers{border-right:1px solid var(--panel-border)}.panel.inspector{width:var(--panel-width);border-left:1px solid var(--panel-border)}.panel-section{padding:10px;border-bottom:1px solid var(--panel-border)}.panel-section.grow{flex:1}.panel-title{text-transform:var(--panel-title-text-transform);font-size:var(--panel-title-font-size);letter-spacing:var(--panel-title-letter-spacing);font-weight:var(--panel-title-font-weight);color:var(--panel-title-color);margin-bottom:8px}.panel-section button.collapsible-header{display:flex;align-items:center;gap:6px;width:100%;padding:0;background:none;border:none;border-radius:0;text-transform:var(--panel-title-text-transform);font-size:var(--panel-title-font-size);font-weight:var(--panel-title-font-weight);color:var(--panel-title-color);letter-spacing:var(--panel-title-letter-spacing);-webkit-user-select:none;user-select:none}.panel-section button.collapsible-header:hover{background:none;color:var(--text)}.panel-section.collapsible.open>.collapsible-header{margin-bottom:12px}.collapsible-header .chevron{font-size:var(--caret-size);display:inline-block;transition:transform .12s ease}.collapsible-header[aria-expanded=true] .chevron{transform:rotate(90deg)}.collapsible-header .collapsible-meta{display:inline-flex;align-items:center;gap:4px;margin-left:auto;font-size:10px;color:var(--text-dim)}.collapsible-header .override-dot{margin-right:0}.panel-subsection{margin-bottom:var(--row-margin-bottom)}.panel-subtitle{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:var(--base-font-size);color:var(--text-dim);margin:8px 0 6px}.muted{color:var(--text-dim)}.upload-asset{display:inline-flex;align-items:center;justify-content:center;width:100%;padding:4px 8px;border:1px solid var(--border, #3a3a3a);border-radius:4px;background:var(--surface-2, #2a2a2a);cursor:pointer;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.upload-asset:hover{border-color:var(--accent, #6633ee)}.upload-asset input[type=file]{display:none}.panel-tabs{display:flex;border-bottom:1px solid var(--panel-border);position:sticky;top:0;background-color:var(--panel);z-index:1}.panel-tabs button{flex:1;background:none;border:none;border-bottom:2px solid transparent;border-radius:0;padding:8px 0;color:var(--text-dim)}.panel-tabs button.active{color:var(--text);border-bottom-color:var(--accent)}.variant-chips{display:flex;flex-wrap:wrap;align-items:center;gap:var(--field-gap)}.variant-chip{font-size:11px;padding:3px 10px;border-radius:999px;border:1px solid var(--panel-border);background:none;color:var(--text-dim);cursor:pointer}.variant-chip.active{color:var(--text);border-color:var(--accent)}.variant-chip.danger:hover{color:var(--danger);border-color:var(--danger)}.override-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-right:4px;vertical-align:1px}.style-row{display:flex;align-items:center;gap:5px;margin-bottom:5px}.style-name{flex:1;min-width:50px;font-family:ui-monospace,monospace;font-size:11px}.style-value{flex:1}.style-add-row{display:flex;gap:4px;margin-top:6px}.text-style-editor{margin:2px 0 8px 18px;display:grid;grid-template-columns:1fr 1fr;gap:4px 8px}.text-style-editor label{display:flex;align-items:center;gap:5px;font-size:10px;color:var(--text-dim)}.text-style-editor label select,.text-style-editor label input{min-width:0;flex:1}.font-editor{margin:2px 0 8px;display:flex;flex-direction:column;gap:4px}.font-editor label{display:flex;align-items:center;gap:5px;font-size:10px;color:var(--text-dim)}.font-editor label input{flex:1;min-width:0}button.disclose{padding:2px 4px;background:none;border:none;color:var(--text-dim)}.swatch{width:16px;height:16px;border-radius:4px;border:1px solid var(--panel-border);flex-shrink:0}.component-row,.layer-row{display:flex;align-items:center;gap:6px;padding:3px 8px;border-radius:var(--input-border-radius);corner-shape:var(--input-corner-shape);cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap}.component-row:hover,.layer-row:hover{background:var(--row-hover)}.component-row.selected,.layer-row.selected{background:var(--accent-soft)}.layer-row.hidden-node{opacity:.45}.layer-row.dragging{opacity:.4}.layer-row.drop-before{box-shadow:inset 0 2px 0 0 var(--accent)}.layer-row.drop-after{box-shadow:inset 0 -2px 0 0 var(--accent)}.layer-row.drop-inside{box-shadow:inset 0 0 0 1px var(--accent)}.component-group{border-radius:4px}.component-group.drop-target{box-shadow:inset 0 0 0 1px var(--accent)}.component-group-header{background:none!important;border-color:transparent!important;display:flex;align-items:center;gap:4px;width:100%;padding:3px 8px;background:none;border:none;border-radius:4px;color:var(--text-dim);cursor:pointer;-webkit-user-select:none;user-select:none;text-align:left}.component-group-header:hover{border-color:var(--row-hover)!important}.component-group-header .disclose-caret{width:12px;flex-shrink:0}.component-group-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.component-group-count{color:var(--text-dim);font-size:10px}.component-row.grouped{padding-left:22px}.component-row.dragging{opacity:.4}.component-list.drop-root{box-shadow:inset 0 0 0 1px var(--accent);border-radius:4px}.component-list-actions{display:flex;gap:6px;align-items:stretch}.component-list-actions .wide{flex:1}.icon-button{display:flex;align-items:center;justify-content:center;margin-top:6px;padding:4px 8px}.icon-button:hover:not(:disabled){color:var(--danger);border-color:var(--danger)}.dialog-note{margin:0;font-size:var(--base-font-size);color:var(--text-dim)}.dialog-warning{margin:0;font-size:var(--base-font-size);color:var(--danger)}.code-usage-list{margin:6px 0;padding-left:16px;max-height:160px;overflow-y:auto;font-size:11px;color:var(--text)}.code-usage-list code{color:var(--text-dim)}.layer-icon{width:14px;text-align:center;color:var(--text-dim)}.layer-name{overflow:hidden;text-overflow:ellipsis}.badge{font-size:9px;background:var(--badge-bg);color:var(--badge-text);border-radius:3px;padding:1px 4px}.insert-buttons{display:grid;grid-template-columns:1fr 1fr;gap:4px}.insert-instance{display:flex;gap:4px;margin-top:6px}.canvas{position:relative;flex:1;overflow:hidden;background:var(--canvas-bg);background-image:radial-gradient(var(--canvas-dot) 1px,transparent 1px);background-size:24px 24px;cursor:default;touch-action:none}.canvas.empty{display:flex;align-items:center;justify-content:center;color:var(--text-dim)}.canvas>div:first-child{will-change:transform}.overlay{position:absolute;pointer-events:none}.overlay.hover{outline:1px solid var(--accent-soft)}.overlay.selection{outline:1.5px solid var(--accent)}.selection-label{position:absolute;top:-18px;left:-2px;background:var(--accent);color:#fff;font-size:10px;padding:1px 6px;border-radius:3px;white-space:nowrap}.resize-handle{position:absolute;right:-5px;bottom:-5px;width:10px;height:10px;background:#fff;border:1.5px solid var(--accent);border-radius:2px;pointer-events:auto;cursor:nwse-resize}.overlay.drop-line{background:var(--accent);border-radius:1px}.screen-view{flex:1;min-width:0;display:flex;flex-direction:column;background:var(--canvas-bg)}.screen-toolbar{display:flex;align-items:center;gap:8px;padding:6px 10px;background:var(--panel);border-bottom:1px solid var(--panel-border);font-size:var(--base-font-size)}.screen-sizer-switch{display:flex;border:1px solid var(--panel-border);border-radius:5px;overflow:hidden}.screen-sizer-switch button{background:none;border:none;border-radius:0;padding:3px 10px;font-size:var(--base-font-size);color:var(--text-dim);cursor:pointer}.screen-sizer-switch button.active{background:var(--control-bg);color:var(--text)}.screen-size-select{width:auto;flex:1}.screen-toolbar select,.screen-toolbar input{background:var(--control-bg);color:var(--text);border:1px solid var(--panel-border);border-radius:5px;padding:var(--input-padding);font-size:var(--base-font-size)}.screen-toolbar input{width:56px}.screen-dim-sep{color:var(--text-dim)}.screen-readout{margin-left:auto;color:var(--text-dim);white-space:nowrap}.screen-area{flex:1;min-height:0;overflow:auto;display:flex;justify-content:center;align-items:flex-start}.screen-frame-wrap{position:relative;flex:none}.screen-frame-wrap.fill{width:100%;height:100%}.screen-frame-wrap.device{margin:24px}.screen-frame{position:relative;width:100%;height:100%;overflow:hidden;touch-action:none}.screen-frame-wrap.device .screen-frame{outline:1px solid var(--panel-border)}.screen-scroll{width:100%;height:100%;overflow-y:auto;overflow-x:hidden;background:#fff}.screen-handle{position:absolute}.screen-handle.e{top:0;right:-6px;width:12px;height:100%;cursor:ew-resize}.screen-handle.s{left:0;bottom:-6px;width:100%;height:12px;cursor:ns-resize}.screen-handle.se{right:-5px;bottom:-5px;width:10px;height:10px;background:#fff;border:1.5px solid var(--panel-border);border-radius:2px;cursor:nwse-resize}.inline-text-editor{position:absolute;resize:none;background:#fffef5;color:#111;border:1px solid var(--accent);border-radius:2px;padding:0 2px;font:inherit;min-width:60px;min-height:20px}.zoom-badge{font-size:var(--base-font-size);position:absolute;right:12px;bottom:12px;display:flex;align-items:center;gap:6px;background:var(--panel);border:1px solid var(--panel-border);border-radius:5px;padding:3px 8px;color:var(--text-dim)}.breakpoint-badge{font-size:var(--base-font-size);position:absolute;left:12px;bottom:12px;display:flex;align-items:center;gap:6px;background:var(--panel);border:1px solid var(--panel-border);border-radius:5px;padding:3px 8px;color:var(--text-dim)}.field-row{display:flex;flex-direction:column;gap:6px;margin-bottom:var(--row-margin-bottom);min-width:0}.field-row .shadow-row-inner{display:flex;flex-direction:column;gap:6px;min-width:0}.field-label-row{display:flex;padding:0;align-items:baseline;justify-content:space-between;gap:6px}.field-label{display:flex;align-items:center;gap:4px;flex:1;min-width:0;font-size:10px;color:var(--text-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.field-hint{font-size:10px;color:var(--text-dim);opacity:.7;white-space:nowrap}.field-control{display:flex;align-items:center;gap:var(--field-gap);min-width:0}.field-cell{display:flex;align-items:center;gap:4px;flex:1;min-width:0}.field-pair{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--field-gap);margin-bottom:8px}.field-pair .field-row{margin-bottom:0}.prop-value-stack{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}.sizing-field,.color-field,.stroke-field{display:flex;align-items:center;gap:var(--field-gap);flex:1;min-width:0;width:100%}.stroke-field{flex-direction:column}.sizing-field>*{flex:1}.quad-field{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--field-gap);flex:1}.gradient-bar{position:relative;flex:1;min-width:0;height:18px;border-radius:4px;border:1px solid var(--panel-border);cursor:copy;margin:0}.gradient-bar .gradient-stop-handle{position:absolute;top:50%;transform:translate(-50%,-50%);width:16px;height:24px;padding:0;border-radius:4px;border:2px solid #fff;box-shadow:inset 0 0 0 2px #0000008d;margin:0 1px;cursor:ew-resize;touch-action:none}.gradient-bar .gradient-stop-handle:hover,.gradient-stop-handle.selected{box-shadow:0 0 0 2px var(--accent)}.expose-row,.props-list-row{display:flex;align-items:center;gap:6px;margin-bottom:5px}.expose-row .prop-pill{flex:1;padding-block:2px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.prop-pill{background:var(--prop-bg);color:var(--prop-text);border-radius:3px;padding:1px 6px;font-family:ui-monospace,monospace;font-size:11px}.expose-kind{color:var(--text-dim);font-size:10px;flex:1}button.dd-trigger{display:flex;align-items:center;justify-content:space-between;gap:4px;width:100%;min-width:0;font-size:var(--base-font-size);color:var(--text);text-align:left;cursor:pointer}button.dd-trigger:focus-visible,button.dd-trigger[aria-expanded=true]{outline:1px solid var(--accent)}.dd-value{display:flex;align-items:center;gap:5px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dd-value.placeholder{color:var(--text-dim)}.dd-value .swatch{width:12px;height:12px}.dd-caret{flex-shrink:0;color:var(--text-dim);font-size:var(--caret-size)}.dd-menu{position:fixed;z-index:300;background:var(--control-bg);border:1px solid var(--control-bg);border-radius:6px;box-shadow:0 8px 24px #0006;padding:4px;overflow-y:auto;overflow-x:hidden;font-size:var(--base-font-size);scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb) var(--scrollbar-track)}.dd-option{display:flex;align-items:center;gap:6px;padding:3px 8px;border-radius:4px;cursor:pointer;color:var(--text);white-space:nowrap}.dd-option.active{background:var(--row-hover)}.dd-option.selected{font-weight:500}.dd-option.selected:before{content:"•";font-weight:500;font-size:16px;line-height:1}.dd-option .swatch{width:12px;height:12px}.dd-option-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.dd-hint{color:var(--text-dim);font-size:11px}.dd-divider{height:1px;background:var(--panel-border);margin:4px 2px}span.combo{display:flex;align-items:center;flex:1;min-width:0;background:var(--input-bg);border:1px solid var(--input-bg);border-radius:var(--input-border-radius);corner-shape:var(--input-corner-shape)}span.combo:focus-within{outline:1px solid var(--accent)}span.combo input{background:none;border:none;min-width:0}span.combo input:focus{outline:none}span.combo:has(input.unit-invalid){border-color:var(--danger)}button.combo-caret{align-self:stretch;padding:0 10px 0 2px;background:none;border:none;font-size:var(--caret-size);color:var(--text-dim)}button.combo-caret:hover:not(:disabled){background:none;color:var(--text)}button.combo.token{display:flex;align-items:center;justify-content:space-between;gap:4px;flex:1;width:100%;min-width:0;color:var(--input-text);background:var(--input-bg);border:1px solid var(--input-bg);border-radius:var(--input-border-radius);corner-shape:var(--input-corner-shape);padding:var(--input-padding);font-size:var(--base-font-size);text-align:left;cursor:pointer}button.combo.token:hover:not(:disabled){background:var(--input-bg);border-color:var(--scrollbar-thumb-hover)}button.combo.token:focus-visible,button.combo.token[aria-expanded=true]{outline:1px solid var(--accent)}.combo-value{display:flex;align-items:center;gap:5px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.combo-value .swatch{width:12px;height:12px}.cloud-card{display:flex;flex-direction:column;gap:10px;min-width:280px;max-width:340px;padding:24px;background:var(--panel);border:1px solid var(--panel-border);border-radius:8px}.cloud-card h1{margin:0;font-size:15px;color:var(--text)}.cloud-card label{display:flex;flex-direction:column;gap:4px;font-size:11px;color:var(--text-dim)}.cloud-card input{padding:6px 8px;border:1px solid var(--panel-border);border-radius:4px;background:var(--bg);color:var(--text)}.cloud-card button{padding:6px 10px;border:1px solid var(--panel-border);border-radius:4px;background:var(--panel);color:var(--text);cursor:pointer}.cloud-card button.primary{background:var(--accent);border-color:var(--accent);color:#fff}.cloud-error{margin:0;color:var(--danger);font-size:11px}.version-row{display:flex;flex-direction:column;gap:2px;padding:8px 10px;border-bottom:1px solid var(--panel-border)}.version-main{display:flex;align-items:baseline;gap:6px}.version-number{font-weight:600;color:var(--text)}.version-label{color:var(--text-dim);font-size:11px}.version-meta{font-size:10px}.version-row button{align-self:flex-start;margin-top:4px}.asset-manager{display:flex;flex-direction:column;gap:12px;width:640px;max-width:90vw;max-height:70vh;padding:20px;background:var(--panel);border:1px solid var(--panel-border);border-radius:8px}.asset-manager-head{display:flex;align-items:baseline;gap:8px}.asset-manager-head h1{margin:0;font-size:15px;color:var(--text)}.asset-manager-empty{padding:24px 0;text-align:center}.asset-manager-list{list-style:none;margin:0;padding:0;overflow-y:auto;display:flex;flex-direction:column}.asset-row{display:grid;grid-template-columns:48px 1fr auto auto;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid var(--panel-border)}.asset-thumb{width:48px;height:48px;object-fit:cover;border-radius:4px;border:1px solid var(--panel-border);background:var(--bg)}.asset-thumb-lg{width:96px;height:96px;align-self:center}.asset-row-main{display:flex;flex-direction:column;gap:3px;min-width:0}.asset-name-field{display:flex;flex-direction:column;gap:3px}.asset-name{padding:4px 6px;border:1px solid var(--panel-border);border-radius:4px;background:var(--bg);color:var(--text);font-size:var(--base-font-size)}.asset-name.plain{border:none;background:none;padding:4px 0}.asset-usage{font-size:11px;color:var(--text-dim);text-align:right}button.danger{border-color:var(--danger);color:var(--danger)}.asset-manager-upload{width:auto;align-self:center}.asset-row.selectable{cursor:pointer}.asset-row.selectable:hover{background:var(--surface-2, #2a2a2a)}.asset-chip{display:flex;align-items:center;gap:6px;flex:1;min-width:0;padding:var(--input-padding);border:1px solid var(--border, #3a3a3a);border-radius:var(--input-border-radius);corner-shape:var(--input-corner-shape);background:var(--surface-2, #2a2a2a);cursor:pointer;text-align:left}.asset-chip:hover{border-color:var(--accent, #6633ee)}.asset-chip-thumb{width:18px;height:18px;flex:none;object-fit:cover;border-radius:3px;border:1px solid var(--panel-border);background:var(--bg)}.asset-chip-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}.asset-chip-name.empty{color:var(--text-dim)}