:root{--color-bg-base: hsl(230, 20%, 7%);--color-bg-surface: hsl(230, 18%, 11%);--color-bg-elevated: hsl(230, 16%, 16%);--color-bg-overlay: hsl(230, 14%, 22%);--color-brand-primary: hsl(262, 83%, 68%);--color-brand-accent: hsl(190, 90%, 58%);--color-brand-glow: hsl(262, 83%, 68%, .25);--color-text-primary: hsl(230, 20%, 95%);--color-text-secondary: hsl(230, 12%, 65%);--color-text-muted: hsl(230, 10%, 45%);--color-border: hsl(230, 14%, 22%);--color-border-subtle: hsl(230, 12%, 18%);--color-success: hsl(145, 60%, 50%);--color-warning: hsl(40, 90%, 58%);--color-error: hsl(350, 80%, 60%);--font-sans: "Inter", system-ui, -apple-system, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--text-4xl: 2.25rem;--text-5xl: 3rem;--font-regular: 400;--font-medium: 500;--font-semibold: 600;--font-bold: 700;--leading-tight: 1.25;--leading-normal: 1.5;--leading-relaxed: 1.75;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--space-20: 5rem;--space-24: 6rem;--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--radius-2xl: 1.5rem;--radius-full: 9999px;--shadow-sm: 0 1px 3px hsl(0 0% 0% / .3);--shadow-md: 0 4px 16px hsl(0 0% 0% / .4);--shadow-lg: 0 8px 32px hsl(0 0% 0% / .5);--shadow-glow: 0 0 32px var(--color-brand-glow);--transition-fast: .15s ease;--transition-base: .25s ease;--transition-slow: .4s ease;--max-width-content: 1200px;--max-width-narrow: 720px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%;scroll-behavior:smooth}body{font-family:var(--font-sans);font-size:var(--text-base);font-weight:var(--font-regular);line-height:var(--leading-normal);color:var(--color-text-primary);background-color:var(--color-bg-base);min-height:100dvh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}img,video,svg{display:block;max-width:100%}a{color:var(--color-brand-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-brand-accent)}button{font-family:inherit;cursor:pointer;border:none;background:none}.glass{background:#171921b3;backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);border:1px solid hsl(230 20% 95% / .06);border-radius:var(--radius-xl)}.gradient-brand{background:linear-gradient(135deg,var(--color-brand-primary),var(--color-brand-accent))}.gradient-text{background:linear-gradient(135deg,var(--color-brand-primary),var(--color-brand-accent));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}:focus-visible{outline:2px solid var(--color-brand-primary);outline-offset:3px;border-radius:var(--radius-sm)}.uploader{width:100%}.uploader__form{display:flex;flex-direction:column;gap:var(--space-6)}.uploader__drop-zone{display:flex;flex-direction:column;gap:var(--space-5);padding:var(--space-8);background:var(--color-bg-elevated);border:2px dashed var(--color-border);border-radius:var(--radius-xl);transition:border-color var(--transition-base),box-shadow var(--transition-base),transform var(--transition-base)}.uploader__drop-zone:focus-within,.uploader__drop-zone:hover{border-color:var(--color-brand-primary);box-shadow:var(--shadow-glow);transform:scale(1.005)}.uploader__drop-zone--uploading{pointer-events:none;opacity:.6}.uploader__field{display:flex;flex-direction:column;gap:var(--space-2)}.uploader__label{font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--color-text-secondary);letter-spacing:.02em;text-transform:uppercase}.uploader__required{color:var(--color-error);margin-left:var(--space-1)}.uploader__optional{font-weight:var(--font-regular);color:var(--color-text-muted);text-transform:none;letter-spacing:0}.uploader__input{font-family:var(--font-sans);font-size:var(--text-sm);color:var(--color-text-primary);background:var(--color-bg-overlay);border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);cursor:pointer;transition:border-color var(--transition-fast)}.uploader__input:hover{border-color:var(--color-brand-primary)}.uploader__error{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-4);background:#eb47631a;border:1px solid var(--color-error);border-radius:var(--radius-md);color:var(--color-error);font-size:var(--text-sm)}.uploader__progress{height:4px;background:var(--color-bg-overlay);border-radius:var(--radius-full);overflow:hidden}.uploader__progress-bar{height:100%;background:linear-gradient(90deg,var(--color-brand-primary),var(--color-brand-accent));border-radius:var(--radius-full);animation:upload-progress 1.8s ease-in-out infinite;transform-origin:left}@keyframes upload-progress{0%{transform:scaleX(0);opacity:1}60%{transform:scaleX(.8);opacity:1}to{transform:scaleX(1);opacity:0}}.uploader__submit{align-self:flex-end;padding:var(--space-3) var(--space-8);background:linear-gradient(135deg,var(--color-brand-primary),var(--color-brand-accent));color:#0e0f15;font-family:var(--font-sans);font-size:var(--text-base);font-weight:var(--font-semibold);border-radius:var(--radius-full);border:none;cursor:pointer;transition:transform var(--transition-fast),box-shadow var(--transition-fast),opacity var(--transition-fast)}.uploader__submit:hover:not(:disabled){transform:translateY(-2px);box-shadow:var(--shadow-glow)}.uploader__submit:active:not(:disabled){transform:translateY(0)}.uploader__submit:disabled{opacity:.35;cursor:not-allowed}@keyframes confirm-modal-fade-in{0%{opacity:0}to{opacity:1}}@keyframes confirm-modal-scale-up{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}.confirm-modal-overlay{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;background:#0e0f15a6;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);animation:confirm-modal-fade-in .2s cubic-bezier(.16,1,.3,1) forwards;padding:var(--space-4)}.confirm-modal{width:100%;max-width:400px;background:#171921f2;border:1px solid hsl(230 20% 95% / .08);border-radius:var(--radius-lg);padding:var(--space-5);box-shadow:var(--shadow-xl),0 20px 25px -5px #00000080;animation:confirm-modal-scale-up .25s cubic-bezier(.34,1.56,.64,1) forwards}.confirm-modal__title{margin:0 0 var(--space-2) 0;font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--color-text-primary);font-family:var(--font-sans)}.confirm-modal__message{margin:0 0 var(--space-5) 0;font-size:var(--text-sm);color:var(--color-text-muted);line-height:1.5;font-family:var(--font-sans)}.confirm-modal__actions{display:flex;justify-content:flex-end;gap:var(--space-3)}.confirm-modal__btn{padding:var(--space-2) var(--space-5);font-family:var(--font-sans);font-size:var(--text-sm);font-weight:var(--font-medium);border-radius:var(--radius-md);cursor:pointer;border:1px solid transparent;transition:background var(--transition-fast),border-color var(--transition-fast),transform var(--transition-fast)}.confirm-modal__btn:hover{transform:translateY(-1px)}.confirm-modal__btn--cancel{border:1px solid var(--color-border);background:var(--color-bg-overlay);color:var(--color-text-secondary)}.confirm-modal__btn--cancel:hover{background:var(--color-bg-elevated);color:var(--color-text-primary);border-color:var(--color-text-muted)}.confirm-modal__btn--confirm{background:linear-gradient(135deg,#eb4763,#d92644);color:#fff;font-weight:var(--font-semibold)}.confirm-modal__btn--confirm:hover{background:linear-gradient(135deg,#ed5e76,#dd3c57);box-shadow:0 0 16px #eb476366}.layer-panel{background:#17192180;backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);border:1px solid hsl(230 20% 95% / .06);border-radius:var(--radius-lg);padding:var(--space-3);display:flex;flex-direction:column;gap:var(--space-2);min-height:120px;max-height:100%}.layer-panel__header{display:flex;align-items:center;justify-content:space-between;padding-bottom:var(--space-2);border-bottom:1px solid var(--color-border-subtle);margin-bottom:var(--space-2)}.layer-panel__header-title{display:flex;align-items:center;gap:var(--space-2);padding-left:var(--space-1)}.layer-panel__header-icon{color:var(--color-text-secondary);flex-shrink:0}.layer-panel__title{font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-secondary)}.layer-panel__toggle-btn{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;border:none;border-radius:var(--radius-sm);background:transparent;color:var(--color-text-secondary);cursor:pointer;transition:color var(--transition-fast),background var(--transition-fast)}.layer-panel__toggle-btn:hover{color:var(--color-text-primary);background:var(--color-bg-elevated)}.layer-panel__toggle-btn--collapsed{width:2rem;height:2rem;border-radius:var(--radius-md);color:var(--color-text-secondary)}.layer-panel--collapsed{min-height:0;padding:var(--space-2) 0;align-items:center}.layer-panel--collapsed .layer-panel__header{border:none;margin:0;padding:0;justify-content:center}.layer-panel__empty{font-size:var(--text-xs);color:var(--color-text-muted);text-align:center;padding:var(--space-4) var(--space-2)}.layer-panel__list{list-style:none;display:flex;flex-direction:column;gap:var(--space-1);flex:1;min-height:0;overflow-y:auto}.layer-panel__list::-webkit-scrollbar{width:6px;height:6px}.layer-panel__list::-webkit-scrollbar-track{background:transparent}.layer-panel__list::-webkit-scrollbar-thumb{background:#f0f1f51a;border-radius:var(--radius-full)}.layer-panel__list::-webkit-scrollbar-thumb:hover{background:#f0f1f533}.layer-panel__item{display:flex;align-items:center;border-radius:var(--radius-md);cursor:grab;transition:background var(--transition-fast),opacity var(--transition-fast)}.layer-panel__item:active{cursor:grabbing}.layer-panel__item--selected{background:#9b6af11f;outline:1px solid hsl(262 83% 68% / .3)}.layer-panel__item--hidden{opacity:.5}.layer-panel__select-btn{flex:1;min-width:0;display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);background:none;border:none;border-radius:var(--radius-md);cursor:inherit;text-align:left;color:var(--color-text-secondary);font-size:var(--text-xs);font-weight:var(--font-medium);font-family:var(--font-sans);transition:color var(--transition-fast)}.layer-panel__select-btn:hover,.layer-panel__item--selected .layer-panel__select-btn{color:var(--color-text-primary)}.layer-panel__kind-icon{font-size:var(--text-xs);color:var(--color-text-secondary);font-family:var(--font-mono);min-width:1.25rem;text-align:center;flex-shrink:0}.layer-panel__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer-panel__actions{display:flex;align-items:center;gap:var(--space-1);padding-right:var(--space-2)}.layer-panel__action-btn{display:inline-flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;border:none;border-radius:var(--radius-sm);background:transparent;color:var(--color-text-secondary);cursor:pointer;transition:color var(--transition-fast),background var(--transition-fast)}.layer-panel__action-btn:hover{color:var(--color-text-primary);background:var(--color-bg-elevated)}.layer-panel__action-btn--delete:hover{color:var(--color-error);background:#eb47631f}.canvas-adorner{position:absolute;inset:0}.canvas-adorner__hit-area{position:absolute;background:transparent;pointer-events:all}.canvas-adorner__selection{position:absolute;border:1.5px dashed var(--color-brand-primary);box-shadow:0 0 0 1px #00000059;border-radius:1px;pointer-events:none}.canvas-adorner__handle{position:absolute;width:10px;height:10px;background:var(--color-bg-surface);border:1.5px solid var(--color-brand-primary);border-radius:2px;box-shadow:0 1px 4px #0006;pointer-events:all}.canvas-adorner__handle--tl{top:-5px;left:-5px;cursor:nwse-resize}.canvas-adorner__handle--t{top:-5px;left:50%;transform:translate(-50%);cursor:ns-resize}.canvas-adorner__handle--tr{top:-5px;right:-5px;cursor:nesw-resize}.canvas-adorner__handle--r{top:50%;right:-5px;transform:translateY(-50%);cursor:ew-resize}.canvas-adorner__handle--br{bottom:-5px;right:-5px;cursor:nwse-resize}.canvas-adorner__handle--b{bottom:-5px;left:50%;transform:translate(-50%);cursor:ns-resize}.canvas-adorner__handle--bl{bottom:-5px;left:-5px;cursor:nesw-resize}.canvas-adorner__handle--l{top:50%;left:-5px;transform:translateY(-50%);cursor:ew-resize}.canvas-adorner__text-input{position:absolute;inset:0;width:100%;height:100%;background:var(--color-bg-surface);color:var(--color-text-primary);border:none;font:inherit;margin:0;padding:4px;outline:none;resize:none;overflow:hidden;pointer-events:all;box-sizing:border-box;font-family:inherit}.props-panel{display:flex;flex-direction:column;gap:var(--space-1);overflow-y:auto;flex:1;min-height:0}.props-panel::-webkit-scrollbar{width:6px;height:6px}.props-panel::-webkit-scrollbar-track{background:transparent}.props-panel::-webkit-scrollbar-thumb{background:#f0f1f51a;border-radius:var(--radius-full)}.props-panel::-webkit-scrollbar-thumb:hover{background:#f0f1f533}.props-panel__empty{font-size:var(--text-xs);color:var(--color-text-muted);text-align:center;padding:var(--space-4) var(--space-2)}.props-panel__section{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-3) 0;border-bottom:1px solid var(--color-border-subtle)}.props-panel__section:last-child{border-bottom:none}.props-panel__section-title{font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:.07em;text-transform:uppercase;color:var(--color-text-secondary);padding:0 var(--space-1)}.props-panel__row{display:grid;grid-template-columns:5rem 1fr;align-items:center;gap:var(--space-2);padding:0 var(--space-1)}.props-panel__row--stack{display:flex;flex-direction:column;gap:var(--space-1);padding:0 var(--space-1)}.props-panel__label{font-size:var(--text-xs);font-weight:var(--font-medium);color:var(--color-text-secondary);font-family:var(--font-sans);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.props-panel__input{width:100%;padding:var(--space-1) var(--space-2);font-family:var(--font-mono);font-size:var(--text-xs);font-weight:var(--font-medium);background:#0e0f15cc;border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-primary);text-align:right;transition:border-color var(--transition-fast);appearance:textfield;box-sizing:border-box}.props-panel__input::-webkit-outer-spin-button,.props-panel__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.props-panel__input:focus{outline:none;border-color:var(--color-brand-primary)}.props-panel__input--invalid{border-color:var(--color-error);color:var(--color-error)}.props-panel__slider{width:100%;height:4px;cursor:pointer;accent-color:var(--color-brand-primary);background:transparent}.props-panel__row--slider{grid-template-columns:5rem auto 1fr;gap:var(--space-2)}.props-panel__row--slider .props-panel__input{width:3.5rem;flex-shrink:0}.props-panel__scale-controls{display:flex;align-items:center;gap:var(--space-2)}.props-panel__scale-controls .props-panel__input{flex:1;min-width:0}.props-panel__lock-btn{display:inline-flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;flex-shrink:0;border:1px solid var(--color-border);border-radius:var(--radius-md);background:#0e0f15cc;color:var(--color-text-secondary);cursor:pointer;transition:color var(--transition-fast),border-color var(--transition-fast),background var(--transition-fast)}.props-panel__lock-btn:hover{color:var(--color-text-primary);border-color:var(--color-text-muted)}.props-panel__lock-btn--active{color:var(--color-brand-primary);border-color:var(--color-brand-primary);background:#9b6af11a}.props-panel__color-row{display:flex;align-items:center;gap:var(--space-2)}.props-panel__color-swatch{position:relative;width:1.75rem;height:1.75rem;border-radius:var(--radius-md);border:1px solid var(--color-border);overflow:hidden;flex-shrink:0;cursor:pointer}.props-panel__color-swatch input[type=color]{position:absolute;inset:-4px;width:calc(100% + 8px);height:calc(100% + 8px);border:none;padding:0;cursor:pointer;opacity:0}.props-panel__color-preview{position:absolute;inset:0;pointer-events:none;border-radius:inherit}.props-panel__color-value{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-text-secondary)}.props-panel__check-row{display:flex;align-items:center;gap:var(--space-2);padding:0 var(--space-1)}.props-panel__check-label{font-size:var(--text-xs);font-weight:var(--font-medium);color:var(--color-text-secondary);cursor:pointer;user-select:none;display:flex;align-items:center;gap:var(--space-2)}.props-panel__checkbox{appearance:none;-webkit-appearance:none;width:1rem;height:1rem;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:#0e0f15cc;cursor:pointer;position:relative;flex-shrink:0;transition:background var(--transition-fast),border-color var(--transition-fast)}.props-panel__checkbox:checked{background:var(--color-brand-primary);border-color:var(--color-brand-primary)}.props-panel__checkbox:checked:after{content:"";position:absolute;left:5px;top:2px;width:4px;height:8px;border:solid #ffffff;border-width:0 2px 2px 0;transform:rotate(45deg)}.props-panel__checkbox:focus-visible{outline:2px solid var(--color-brand-primary);outline-offset:2px}.props-panel__select{width:100%;padding:var(--space-1) var(--space-2);font-family:var(--font-sans);font-size:var(--text-xs);font-weight:var(--font-medium);background:#0e0f15cc;border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-primary);cursor:pointer;transition:border-color var(--transition-fast);appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23555e7a'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .5rem center;padding-right:1.5rem;box-sizing:border-box}.props-panel__select:focus{outline:none;border-color:var(--color-brand-primary)}.props-panel__segmented{display:flex;gap:2px;background:#0e0f15cc;border:1px solid var(--color-border);border-radius:var(--radius-md);padding:2px}.props-panel__seg-btn{flex:1;padding:var(--space-1) var(--space-2);font-family:var(--font-sans);font-size:var(--text-xs);font-weight:var(--font-medium);border:none;border-radius:calc(var(--radius-md) - 2px);background:transparent;color:var(--color-text-muted);cursor:pointer;transition:background var(--transition-fast),color var(--transition-fast);white-space:nowrap}.props-panel__seg-btn:hover{color:var(--color-text-primary)}.props-panel__seg-btn--active{background:var(--color-bg-elevated);color:var(--color-text-primary)}.props-panel__image-wrapper{padding:0 var(--space-1)}.props-panel__replace-btn{width:100%;padding:var(--space-2) var(--space-3);font-family:var(--font-sans);font-size:var(--text-xs);font-weight:var(--font-medium);border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-bg-overlay);color:var(--color-text-primary);cursor:pointer;transition:background var(--transition-fast),border-color var(--transition-fast);text-align:center}.props-panel__replace-btn:hover{background:var(--color-bg-elevated);border-color:var(--color-brand-primary)}.editor-layout{position:relative;display:block;min-height:0}.editor-layout__canvas-area{position:relative;width:100%}.editor-layout__layers,.editor-layout__inspector{position:absolute;top:var(--space-4);bottom:var(--space-4);z-index:10;pointer-events:none;display:flex;flex-direction:column}.editor-layout__layers>*,.editor-layout__inspector>*{pointer-events:auto;flex:1;min-height:0}.editor-layout__layers{left:var(--space-4);width:200px;transition:width var(--transition-base)}.editor-layout__inspector{right:var(--space-4);width:260px;transition:width var(--transition-base)}.editor-layout.editor-layout--collapsed-layers .editor-layout__layers,.editor-layout.editor-layout--collapsed-properties .editor-layout__inspector{width:48px}@media(max-width:900px){.editor-layout{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}.editor-layout__canvas-area{grid-column:1 / -1;order:-1}.editor-layout__layers,.editor-layout__inspector{position:relative;inset:auto;width:auto!important}}@media(max-width:540px){.editor-layout{grid-template-columns:1fr}}.canvas-designer{display:flex;flex-direction:column;gap:var(--space-4)}.canvas-designer__toolbar{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:#171921b3;backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);border:1px solid hsl(230 20% 95% / .06);border-radius:var(--radius-lg);flex-wrap:wrap}.canvas-designer__creation-tools{display:flex;align-items:center;gap:var(--space-2)}.canvas-designer__separator{width:1px;height:24px;background-color:var(--color-border);margin:0 var(--space-2)}.canvas-designer__file-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.canvas-designer__btn{padding:var(--space-2) var(--space-5);font-family:var(--font-sans);font-size:var(--text-sm);font-weight:var(--font-medium);border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-bg-overlay);color:var(--color-text-primary);cursor:pointer;transition:background var(--transition-fast),border-color var(--transition-fast),transform var(--transition-fast)}.canvas-designer__btn:hover:not(:disabled){background:var(--color-bg-elevated);border-color:var(--color-brand-primary);transform:translateY(-1px)}.canvas-designer__btn:disabled{opacity:.35;cursor:not-allowed}.canvas-designer__btn--icon{display:inline-flex;align-items:center;justify-content:center;padding:0;width:2rem;height:2rem;aspect-ratio:1}.canvas-designer__btn--with-icon{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-2) var(--space-4)}.canvas-designer__btn svg{display:block;flex-shrink:0}.canvas-designer__btn--primary{background:linear-gradient(135deg,var(--color-brand-primary),var(--color-brand-accent));border-color:transparent;color:#0e0f15;font-weight:var(--font-semibold)}.canvas-designer__btn--primary:hover:not(:disabled){background:linear-gradient(135deg,var(--color-brand-primary),var(--color-brand-accent));box-shadow:var(--shadow-glow);border-color:transparent}.canvas-designer__btn--danger{background:#eb47631f;border-color:#eb47634d;color:var(--color-error);padding:var(--space-1) var(--space-3);font-size:var(--text-xs)}.canvas-designer__zoom-controls{display:flex;align-items:center;gap:var(--space-2)}.canvas-designer__zoom-value{width:3.5rem;height:2rem;padding:0 var(--space-1);font-family:var(--font-mono);font-size:var(--text-xs);font-weight:var(--font-medium);background:#0e0f15cc;border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-primary);text-align:center;box-sizing:border-box}.canvas-designer__zoom-value:focus{outline:none;border-color:var(--color-brand-primary)}.canvas-designer__btn--upload{margin-left:auto;padding-left:var(--space-3);padding-right:var(--space-3)}.canvas-designer__btn--danger:hover:not(:disabled){background:#eb476333;border-color:var(--color-error)}.canvas-designer__btn--icon.canvas-designer__btn--danger{padding:0}@keyframes canvas-designer-spin{to{transform:rotate(360deg)}}.canvas-designer__spinner{animation:canvas-designer-spin 1s linear infinite}.canvas-designer__error{padding:var(--space-3) var(--space-4);background:#eb47631a;border:1px solid var(--color-error);border-radius:var(--radius-md);color:var(--color-error);font-size:var(--text-sm)}.inspector-panel{background:#17192180;backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);border:1px solid hsl(230 20% 95% / .06);border-radius:var(--radius-lg);padding:var(--space-3);display:flex;flex-direction:column;gap:var(--space-2);min-height:120px;max-height:100%}.inspector-panel__header{display:flex;align-items:center;justify-content:space-between;padding-bottom:var(--space-2);border-bottom:1px solid var(--color-border-subtle);margin-bottom:var(--space-2)}.inspector-panel__header-title{display:flex;align-items:center;gap:var(--space-2);padding-left:var(--space-1)}.inspector-panel__header-icon{color:var(--color-text-secondary);flex-shrink:0}.inspector-panel__title{font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-secondary)}.inspector-panel__toggle-btn{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;border:none;border-radius:var(--radius-sm);background:transparent;color:var(--color-text-secondary);cursor:pointer;transition:color var(--transition-fast),background var(--transition-fast)}.inspector-panel__toggle-btn:hover{color:var(--color-text-primary);background:var(--color-bg-elevated)}.inspector-panel__toggle-btn--collapsed{width:2rem;height:2rem;border-radius:var(--radius-md);color:var(--color-text-secondary)}.inspector-panel--collapsed{min-height:0;padding:var(--space-2) 0;align-items:center}.inspector-panel--collapsed .inspector-panel__header{border:none;margin:0;padding:0;justify-content:center}.inspector-panel__empty,.inspector-panel__hint{font-size:var(--text-xs);color:var(--color-text-muted);text-align:center;padding:var(--space-4) var(--space-2)}.canvas-designer__viewport{width:100%;aspect-ratio:16 / 9;min-height:auto;max-height:70vh;overflow:hidden;position:relative;background:var(--color-bg-base);border-radius:var(--radius-lg)}.canvas-designer__viewport--panning{cursor:grabbing}.canvas-designer__pan-container{position:absolute;top:0;left:0;transform-origin:0 0}.canvas-designer__canvas-wrapper{position:relative;width:100%;height:100%;background:var(--color-bg-elevated);box-shadow:var(--shadow-md)}.canvas-designer__canvas-wrapper--clipped{overflow:hidden}.canvas-designer__canvas{display:block;pointer-events:none}.canvas-designer__canvas-wrapper--transparent-grid{background:conic-gradient(silver 90deg,#d0d0d0 90deg 180deg,silver 180deg 270deg,#d0d0d0 270deg);background-size:18px 18px}.canvas-designer--locked .canvas-designer__canvas{opacity:.15}.canvas-designer__lock-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-3);z-index:1;color:var(--color-text-muted);font-size:var(--text-sm)}.canvas-designer__lock-icon{font-size:var(--text-3xl);opacity:.5}@media(max-width:600px){.canvas-designer__toolbar{justify-content:center}.canvas-designer__btn--upload{margin-left:0}}.job-status{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);padding:var(--space-8);border-radius:var(--radius-xl);text-align:center;animation:job-status-enter var(--transition-slow) ease both}@keyframes job-status-enter{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.job-status--processing{background:var(--color-bg-elevated)}.job-status__spinner{display:block;width:48px;height:48px;border-radius:var(--radius-full);background:conic-gradient(var(--color-brand-primary),var(--color-brand-accent),var(--color-bg-elevated));animation:spin 1s linear infinite;mask:radial-gradient(farthest-side,transparent calc(100% - 5px),#000 calc(100% - 4px));-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 5px),#000 calc(100% - 4px))}@keyframes spin{to{transform:rotate(360deg)}}.job-status__label{color:var(--color-text-secondary);font-size:var(--text-sm)}.job-status--completed{background:#33cc7314;border:1px solid hsl(145 60% 50% / .3)}.job-status__heading{font-size:var(--text-xl);font-weight:var(--font-semibold);color:var(--color-text-primary)}.job-status__download{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-8);background:linear-gradient(135deg,var(--color-brand-primary),var(--color-brand-accent));color:#0e0f15;font-weight:var(--font-semibold);border-radius:var(--radius-full);text-decoration:none;transition:transform var(--transition-fast),box-shadow var(--transition-fast)}.job-status__download:hover{transform:translateY(-2px);box-shadow:var(--shadow-glow);color:#0e0f15}.job-status--failed{background:#eb476314;border:1px solid hsl(350 80% 60% / .3);border-left:4px solid var(--color-error)}.job-status__reason{font-size:var(--text-sm);color:var(--color-text-secondary);max-width:40ch}.job-status--timeout{background:#f4b43414;border:1px solid hsl(40 90% 58% / .3);border-left:4px solid var(--color-warning)}.app{display:flex;flex-direction:column;min-height:100dvh}.app__hero{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--space-20) var(--space-6) var(--space-12);position:relative}.app__hero:before{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:600px;height:400px;background:radial-gradient(ellipse at center,hsl(262 83% 68% / .12) 0%,transparent 70%);pointer-events:none}.app__title{font-size:var(--text-5xl);font-weight:var(--font-bold);letter-spacing:-.03em;line-height:var(--leading-tight);margin-bottom:var(--space-4)}.app__tagline{font-size:var(--text-lg);color:var(--color-text-secondary);max-width:480px;line-height:var(--leading-relaxed)}.app__content{flex:1;width:100%;display:flex;flex-direction:column;align-items:center;margin:0 auto;padding:0 var(--space-6) var(--space-24)}.app__section{width:100%;max-width:var(--max-width-content);display:flex;flex-direction:column;gap:var(--space-6);padding:var(--space-8);background:#171921b3;backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);border:1px solid hsl(230 20% 95% / .06);border-radius:var(--radius-2xl);box-shadow:var(--shadow-lg);animation:section-enter .35s ease both}.app__section--wide{max-width:1600px}@keyframes section-enter{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.app__section-title{font-size:var(--text-xl);font-weight:var(--font-semibold);color:var(--color-text-primary);letter-spacing:-.01em}.app__section-description{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:var(--leading-relaxed);margin-top:calc(var(--space-2) * -1)}@media(max-width:640px){.app__title{font-size:var(--text-4xl)}.app__hero{padding:var(--space-12) var(--space-4) var(--space-8)}.app__content{padding:0 var(--space-4) var(--space-16)}.app__section{padding:var(--space-6)}}