:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--app-bg:#242424;--canvas-bg:#343434;--surface:#3a3a3ad6;--surface-solid:#3a3a3a;--surface-raised:#484848e6;--surface-hover:#ffffff14;--surface-active:#ffffff24;--text:#fffffff0;--text-secondary:#ebeff594;--text-tertiary:#ebeff559;--accent:#ededed;--accent-ink:#292929;--danger:#ff6969;--shadow-soft:0 16px 48px #0000003d;--shadow-float:0 22px 70px #00000061;--radius-small:8px;--radius-medium:12px;--radius-large:18px;--radius-pill:999px;--font-ui:-apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", sans-serif;--font-mono:"SFMono-Regular", "Cascadia Code", Consolas, monospace}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}body{background:var(--app-bg);color:var(--text);font-family:var(--font-ui);-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;font-size:12px}button,input,select{font:inherit;border:0;outline:0;margin:0}button{color:inherit}.app-shell{background:var(--app-bg);grid-template-rows:52px minmax(0,1fr) 28px;width:100%;height:100%;transition:background .18s;display:grid}.app-shell.object-mode{--canvas-bg:#15171b}.app-shell.edit-mode{--canvas-bg:#414141;background:#303030}.app-shell.edit-mode .top-bar{background:#313131f5}.app-shell.edit-mode .workspace-shell{box-shadow:inset 0 3px #ffffff14}.app-shell.edit-mode .mode-capsule{color:#2c2c2c;background:#e4e4e4}.top-bar{z-index:20;-webkit-backdrop-filter:blur(24px)saturate(145%);backdrop-filter:blur(24px)saturate(145%);background:#222222f0;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 14px;display:grid;position:relative;box-shadow:0 6px 24px #0000001f}.top-bar__leading,.top-bar__trailing{align-items:center;gap:10px;display:flex}.top-bar__trailing{justify-content:flex-end}.top-bar__center,.history-controls{align-items:center;gap:5px;display:flex}.history-controls{border-radius:var(--radius-pill);background:#ffffff09;padding:3px}.brand-mark{background:var(--accent);width:28px;height:28px;color:var(--accent-ink);letter-spacing:-.06em;border-radius:9px;place-items:center;font-size:14px;font-weight:850;display:grid;box-shadow:0 8px 24px #00000038}.document-trigger{border-radius:var(--radius-small);text-align:left;cursor:pointer;background:0 0;grid-template-rows:auto auto;grid-template-columns:auto 16px;align-items:center;column-gap:6px;min-width:128px;padding:5px 9px;transition:background .13s;display:grid}.document-trigger:hover{background:var(--surface-hover)}.document-trigger>span:first-child{text-overflow:ellipsis;white-space:nowrap;max-width:210px;font-weight:600;overflow:hidden}.document-trigger small{color:var(--text-tertiary);font-size:12px}.document-trigger__chevron{color:var(--text-secondary);grid-area:1/2/3;font-size:16px}.mode-capsule,.prototype-label{border-radius:var(--radius-pill);color:var(--text-secondary);background:#ffffff0d;padding:6px 10px;font-size:12px;font-weight:600}.prototype-label{font-family:var(--font-mono);letter-spacing:.08em;background:0 0;font-size:12px}.workspace-shell{grid-template-columns:minmax(0,1fr) auto;min-width:0;min-height:0;display:grid;position:relative;overflow:hidden}.viewport-shell{background-color:var(--canvas-bg);background-image:radial-gradient(circle,#ffffff24 .7px,#0000 .8px);background-position:var(--grid-x) var(--grid-y);background-size:var(--grid-size) var(--grid-size);grid-column:1;min-width:0;min-height:0;position:relative;overflow:hidden}.viewport-shell canvas{touch-action:none;cursor:default;outline:0;width:100%;height:100%;display:block}.viewport-shell canvas.brush-cursor{cursor:crosshair}.viewport-shell canvas.pixel-preview{image-rendering:pixelated}.viewport-shell canvas.is-space-held{cursor:grab}.viewport-shell canvas.is-panning{cursor:grabbing}.mode-banner{z-index:10;border-radius:var(--radius-pill);color:var(--text-secondary);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);pointer-events:none;background:#2626269e;align-items:baseline;gap:8px;padding:7px 11px;display:flex;position:absolute;top:12px;left:50%;transform:translate(-50%)}.mode-banner strong{color:var(--text);font-size:12px}.mode-banner span{font-size:12px}.mode-banner.edit{color:#2323239e;background:#e6e6e6e6}.mode-banner.edit strong{color:#252525}.pixel-grid{z-index:2;background-image:linear-gradient(90deg,#ffffff29 1px,#0000 1px),linear-gradient(#ffffff29 1px,#0000 1px);background-position:var(--pixel-grid-x) var(--pixel-grid-y), var(--pixel-grid-x) var(--pixel-grid-y);background-size:var(--pixel-grid-size) var(--pixel-grid-size);pointer-events:none;position:absolute;inset:0}.edit-hover-overlay{z-index:14;pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.edit-hover-overlay__point{fill:#ffffff24;stroke:var(--accent);stroke-width:2px}.edit-hover-overlay__line{fill:none;stroke:var(--accent);stroke-width:3px;stroke-linecap:round;stroke-linejoin:round;opacity:.9}.edit-hover-overlay__line.width{stroke-width:var(--hover-width);opacity:.28}.context-menu{z-index:30;width:218px;box-shadow:var(--shadow-float);-webkit-backdrop-filter:blur(24px)saturate(1.2);backdrop-filter:blur(24px)saturate(1.2);background:#23252bf0;border-radius:15px;gap:6px;padding:8px;display:grid;position:absolute}.context-menu__section{gap:2px;display:grid}.context-menu__section+.context-menu__section{padding-top:6px}.context-menu__section>small{color:var(--text-tertiary);padding:3px 8px 4px;font-size:12px}.tool-rail{z-index:10;position:absolute;top:14px;left:14px}.surface-panel{background:var(--surface);box-shadow:var(--shadow-soft);-webkit-backdrop-filter:blur(28px)saturate(145%);backdrop-filter:blur(28px)saturate(145%)}.tool-rail .surface-panel{border-radius:15px;padding:5px}.tool-stack{gap:4px;display:grid}.icon-button{width:34px;height:34px;color:var(--text-secondary);cursor:pointer;background:0 0;border-radius:10px;place-items:center;padding:0;transition:background .12s,color .12s,transform .12s;display:inline-grid}.icon-button:hover{background:var(--surface-hover);color:var(--text)}.icon-button:active{transform:scale(.94)}.icon-button.active{background:var(--surface-active);color:var(--accent)}.icon-button.compact{border-radius:8px;width:28px;height:28px;font-size:12px}.icon-button.danger{color:var(--danger);background:#ff696924}.icon-button:disabled{opacity:.35;cursor:default}.icon-button__glyph{font-size:16px;font-weight:650;line-height:1}.text-button{background:var(--accent);min-height:34px;color:var(--accent-ink);cursor:pointer;border-radius:10px;padding:0 14px;font-weight:650;transition:filter .12s,transform .12s}.text-button:hover{filter:brightness(1.06)}.text-button:active{transform:scale(.98)}.text-button.quiet{background:var(--surface-hover);color:var(--text)}.text-button.danger{color:var(--danger);background:#ff696924}.inspector-panel{background:var(--canvas-bg);grid-column:2;width:276px;min-height:0;padding:10px 10px 10px 0}.inspector-panel .surface-panel{border-radius:var(--radius-large);height:100%;overflow:auto}.inspector-header{justify-content:space-between;align-items:center;padding:16px 16px 12px;display:flex}.inspector-header>div{gap:3px;display:grid}.inspector-header strong{text-overflow:ellipsis;white-space:nowrap;max-width:168px;font-size:13px;overflow:hidden}.inspector-header small{color:var(--text-tertiary);font-size:12px}.mode-toggle{border-radius:var(--radius-pill);background:var(--surface-hover);color:var(--text-secondary);cursor:pointer;padding:6px 9px;font-size:12px}.submode-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;padding:0 16px 5px;display:grid}.edit-submode-button{min-width:0;height:30px;color:var(--text-secondary);cursor:pointer;background:0 0;border-radius:9px;justify-content:space-between;align-items:center;padding:0 8px;font-size:12px;display:flex}.edit-submode-button:hover,.edit-submode-button:focus-visible{background:var(--surface-hover);color:var(--text)}.edit-submode-button.active{background:var(--surface-active);color:var(--text)}.edit-submode-button kbd{opacity:.36;font-family:var(--font-mono);font-size:12px}.control-section{padding:13px 16px}.control-section__header{justify-content:space-between;align-items:center;margin-bottom:11px;display:flex}.control-section__title{color:var(--text-secondary);letter-spacing:.02em;font-size:12px;font-weight:650}.control-section__note{color:var(--text-tertiary);font-size:12px}.control-section__body{gap:7px;display:grid}.field-row{grid-template-columns:minmax(78px,.9fr) minmax(0,1.1fr);align-items:center;gap:8px;min-height:30px;display:grid}.field-label{color:var(--text-secondary);text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.number-field,.color-field,.text-field,.multiline-field,.select-field{border-radius:var(--radius-small);min-width:0;height:30px;color:var(--text);background:#ffffff0e;transition:background .12s}.number-field:focus-within,.color-field:focus-within,.text-field:focus-within,.multiline-field:focus-within,.select-field:focus-within,.number-field:focus,.color-field:focus,.text-field:focus,.multiline-field:focus,.select-field:focus{background:#ffffff18}.field-row--multiline{align-items:start}.field-row--multiline .field-label{padding-top:8px}.multiline-field{resize:vertical;white-space:pre-wrap;width:100%;min-height:84px;padding:8px 10px;line-height:1.45}.preview-options{gap:7px;display:grid}.preview-options__zoom{min-height:32px;color:var(--text-secondary);grid-template-columns:minmax(78px,.9fr) minmax(0,1.1fr);align-items:center;font-size:12px;display:grid}.preview-options__zoom .text-button{justify-self:stretch}.number-field{align-items:center;padding:0 8px;display:flex}.number-field input{width:100%;min-width:0;color:inherit;font-family:var(--font-mono);background:0 0;padding:0;font-size:12px}.number-field__unit{color:var(--text-tertiary);font-size:12px}.color-field{cursor:pointer;align-items:center;gap:7px;padding:0 8px;display:flex;position:relative}.color-field:before{background:var(--swatch);content:"";border-radius:50%;width:15px;height:15px;box-shadow:0 2px 8px #00000040}.color-field input{opacity:0;width:1px;height:1px;position:absolute}.color-field__value{font-family:var(--font-mono);font-size:12px}.text-field,.select-field{width:100%;padding:0 8px}.select-field{appearance:none}.toggle-field{border-radius:var(--radius-pill);cursor:pointer;background:#ffffff1a;justify-self:end;width:34px;height:20px;padding:2px;transition:background .15s;position:relative}.toggle-field span{background:#ffffffbd;border-radius:50%;width:16px;height:16px;transition:transform .15s;display:block;box-shadow:0 2px 7px #00000047}.toggle-field.active{background:var(--accent)}.toggle-field.active span{background:var(--accent-ink);transform:translate(14px)}.shortcut-grid{color:var(--text-tertiary);grid-template-columns:1fr 1fr;gap:7px;font-size:12px;display:grid}.shortcut-grid kbd{width:20px;height:20px;color:var(--text-secondary);font-family:var(--font-mono);background:#ffffff0f;border-radius:6px;place-items:center;margin-right:3px;display:inline-grid}.operation-menu{gap:4px;display:grid}.operation-button{min-height:34px;color:var(--text-secondary);text-align:left;cursor:pointer;background:#ffffff09;border-radius:10px;grid-template-columns:27px minmax(0,1fr) auto;align-items:center;padding:0 9px 0 5px;transition:background .12s,color .12s;display:grid}.operation-button:hover,.operation-button:focus-visible{background:var(--surface-hover);color:var(--text)}.operation-button kbd{color:var(--text-tertiary);font-family:var(--font-mono);font-size:12px}.operation-button__icon{width:23px;height:23px;color:var(--accent);background:#ffffff0d;border-radius:7px;place-items:center;font-size:13px;font-weight:700;display:grid}.status-bar{z-index:15;color:var(--text-tertiary);background:#232323f7;justify-content:space-between;align-items:center;padding:0 14px;font-size:12px;display:flex;position:relative;box-shadow:0 -6px 24px #0000001a}.operation-feedback{z-index:40;pointer-events:none;flex-direction:column;align-items:flex-start;gap:6px;width:min(360px,100vw - 24px);display:flex;position:absolute;bottom:36px;left:10px}.operation-feedback__item{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#303030e0;border-radius:11px;gap:2px;max-width:100%;padding:8px 11px;animation:.15s ease-out both feedback-enter;display:grid;box-shadow:0 9px 26px #0003}.operation-feedback__item strong{color:var(--text);font-size:12px;font-weight:650}.operation-feedback__item span{color:var(--text-secondary);text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}@keyframes feedback-enter{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.status-bar__leading,.status-bar__trailing{align-items:center;gap:14px;display:flex}.status-bar__trailing strong{min-width:44px;color:var(--text-secondary);font-family:var(--font-mono);text-align:right}.status-pulse{background:var(--accent);border-radius:50%;width:5px;height:5px;box-shadow:0 0 10px #ffffff61}.status-pulse.saving{animation:.9s infinite alternate pulse}.document-popover{z-index:40;width:390px;max-height:min(580px,100vh - 82px);box-shadow:var(--shadow-float);-webkit-backdrop-filter:blur(36px)saturate(150%);backdrop-filter:blur(36px)saturate(150%);background:#23252bf5;border-radius:20px;padding:10px;position:absolute;top:46px;left:14px;overflow:hidden}.document-popover__header,.document-popover__footer{justify-content:space-between;align-items:center;padding:8px;display:flex}.document-popover__header>div,.document-popover__footer>div{gap:3px;display:grid}.document-popover__header small,.document-popover__footer small{color:var(--text-tertiary);font-size:12px}.document-popover__footer{justify-content:stretch}.document-popover__footer .text-button{width:100%}.document-list{gap:5px;max-height:420px;padding:4px;display:grid;overflow:auto}.document-item{background:0 0;border-radius:14px;grid-template-columns:minmax(0,1fr) auto;align-items:center;padding:5px;transition:background .12s;display:grid}.document-item:hover,.document-item.active{background:#ffffff0e}.document-item.active .document-item__preview{background:var(--accent);color:var(--accent-ink)}.document-item__main{text-align:left;cursor:pointer;background:0 0;align-items:center;gap:10px;min-width:0;padding:5px;display:flex}.document-item__preview{width:38px;height:38px;color:var(--text-secondary);background:#ffffff14;border-radius:12px;flex:none;place-items:center;font-weight:700;display:grid}.document-item__copy{gap:4px;min-width:0;display:grid}.document-item__copy strong,.document-item__copy small{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.document-item__copy small{color:var(--text-tertiary);font-size:12px}.document-item__actions{opacity:0;gap:2px;transition:opacity .12s;display:flex}.document-item:hover .document-item__actions,.document-item:focus-within .document-item__actions{opacity:1}.document-item__rename{width:100%;color:var(--text);background:#ffffff14;border-radius:6px;padding:3px 6px}.marquee{pointer-events:none;background:#ffffff21;border-radius:6px;position:absolute;box-shadow:0 8px 28px #ffffff0d}.transform-gizmo{z-index:12;pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.bezier-handles{z-index:13;pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.bezier-handle .bezier-handle__line{stroke:#8e9eb4b3;stroke-width:1px;vector-effect:non-scaling-stroke}.bezier-handle .bezier-handle__hit{fill:#0000;pointer-events:all;cursor:move}.bezier-handle .bezier-handle__visual{fill:var(--canvas-bg);stroke:#d2dcebe6;stroke-width:1.5px;filter:drop-shadow(0 2px 5px #00000073);pointer-events:none}.bezier-handle.active .bezier-handle__line{stroke:#ffffffd1}.bezier-handle.active .bezier-handle__visual{stroke:var(--accent)}.transform-gizmo__bounds,.transform-gizmo__stem{fill:none;stroke:#ffffffd1;stroke-width:1px;vector-effect:non-scaling-stroke}.transform-gizmo__stem{stroke-dasharray:3 3}.transform-gizmo__pivot{fill:var(--accent);filter:drop-shadow(0 1px 4px #0000008c)}.transform-handle .transform-handle__hit{fill:#0000;pointer-events:all;cursor:var(--handle-cursor)}.transform-handle .transform-handle__visual{fill:var(--accent);filter:drop-shadow(0 2px 5px #0000007a);pointer-events:none}.transform-handle.rotation .transform-handle__visual{fill:var(--canvas-bg);stroke:var(--accent);stroke-width:2px}.add-menu{z-index:30;width:212px;box-shadow:var(--shadow-float);-webkit-backdrop-filter:blur(32px)saturate(155%);backdrop-filter:blur(32px)saturate(155%);background:#26282ff0;border-radius:18px;padding:8px;position:absolute}.add-menu header{justify-content:space-between;align-items:center;padding:7px 8px 9px;display:flex}.add-menu header strong{font-size:13px}.add-menu header kbd{color:var(--text-tertiary);font-family:var(--font-mono);font-size:12px}.add-menu footer{color:var(--text-tertiary);padding:8px 9px 5px;font-size:12px}.add-menu__items{gap:3px;display:grid}.add-menu-item{min-height:38px;color:var(--text-secondary);text-align:left;cursor:pointer;background:0 0;border-radius:11px;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;padding:0 9px 0 6px;transition:background .12s,color .12s;display:grid}.add-menu-item:hover,.add-menu-item:focus-visible{background:var(--surface-hover);color:var(--text)}.add-menu-item kbd{color:var(--text-tertiary);font-family:var(--font-mono);font-size:12px}.add-menu-item__icon{width:24px;height:24px;color:var(--accent);background:#ffffff0e;border-radius:8px;place-items:center;font-size:15px;font-weight:650;display:grid}.empty-hint{pointer-events:none;text-align:center;gap:7px;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.empty-hint span{color:var(--text-secondary);font-size:14px;font-weight:600}.empty-hint small{color:var(--text-tertiary);font-size:12px}.error-panel{border-radius:var(--radius-large);width:min(360px,100% - 40px);box-shadow:var(--shadow-float);text-align:center;background:#372226f0;gap:6px;padding:18px;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.error-panel span{color:var(--text-secondary)}@keyframes pulse{0%{opacity:.3}to{opacity:1}}@media (width<=760px){.inspector-panel{z-index:12;position:absolute;top:0;bottom:0;right:0}.prototype-label,.status-bar__trailing span:not(:last-child){display:none}}