:root{color-scheme:light;font-family:Inter,Avenir Next,Segoe UI,sans-serif;--font-size-12: 12px;--font-size-14: 14px;--font-size-16: 16px;--line-height-tight: 1.1;--line-height-ui: 1.25;--line-height-copy: 1.4;--tracking-caps: .14em;--tracking-caps-wide: .16em;--tracking-label: -.03em;--tracking-value: -.04em;--type-section-size: var(--font-size-16);--type-section-line: var(--line-height-tight);--type-section-track: var(--tracking-caps);--type-label-size: var(--font-size-14);--type-label-line: var(--line-height-ui);--type-label-track: var(--tracking-label);--type-value-size: var(--font-size-16);--type-value-line: var(--line-height-tight);--type-value-track: var(--tracking-value);--type-meta-size: var(--font-size-12);--type-meta-line: var(--line-height-ui);--type-meta-track: var(--tracking-caps-wide);--paper: #242424;--paper-strong: #303030;--ink: #ffffff;--muted: rgba(255, 255, 255, .7);--line: rgba(255, 255, 255, .06);--line-strong: rgba(255, 255, 255, .1);--shadow: 0 24px 60px rgba(0, 0, 0, .34);--shadow-soft: 0 8px 32px rgba(0, 0, 0, .5);background:#fff;color:var(--ink)}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:#fff;line-height:var(--line-height-copy);overflow-x:hidden}button,input{font:inherit}.page-shell{position:relative;width:100%;min-height:100vh;padding:0}.app-title{position:fixed;top:24px;left:24px;z-index:20;margin:0;font-size:var(--type-meta-size);font-weight:700;line-height:var(--type-meta-line);letter-spacing:var(--type-meta-track);text-transform:uppercase;color:var(--muted)}.workspace{min-height:100vh;display:block}.canvas-panel{min-width:0;min-height:100vh;padding:16px 320px 16px 16px}.sidebar-panel-inner{display:grid;gap:0;align-content:start;height:100%;overflow-y:auto;padding:10px 12px 12px}.sidebar-card{border:0;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:0;box-shadow:none}.canvas-workspace{position:relative;min-height:calc(100vh - 80px);padding:0;display:grid;place-items:center;overflow:hidden;background:#fff}.canvas-workspace[data-has-image=false]{cursor:pointer}.canvas-workspace[data-dragging=true]{background:#11111105}.canvas-workspace:focus-visible{outline:none}.upload-placeholder{position:absolute;inset:50% auto auto 50%;z-index:2;width:min(100%,320px);transform:translate(-50%,-50%);transition:opacity .16s ease}.canvas-workspace[data-has-image=true] .upload-placeholder{opacity:0;pointer-events:none}.upload-placeholder-inner{display:grid;place-items:center;min-height:128px;padding:22px;border:1px dashed rgba(17,17,17,.12);border-radius:26px;background:#ffffffeb;box-shadow:0 12px 30px #0000000f}.upload-placeholder-copy{margin:0;padding:14px 18px;border:1px solid rgba(17,17,17,.08);border-radius:999px;background:#11111108;font-size:var(--type-meta-size);font-weight:700;line-height:var(--type-meta-line);letter-spacing:var(--type-meta-track);text-transform:uppercase;color:var(--muted)}.controls-card,.utility-card{width:100%;padding:0}.utility-card{position:relative;padding-bottom:0}.sidebar-panel{position:fixed;top:16px;right:16px;bottom:16px;width:280px;overflow:hidden;border:1px solid rgba(255,255,255,.1);border-radius:14px;background:#212121;box-shadow:var(--shadow-soft)}.controls-card{padding-top:4px;border-top:0}.sidebar-header{margin-bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:12px}.sidebar-header h1{margin:0;color:#fff6;font-size:13px;font-weight:600;line-height:1.5;letter-spacing:-.15px}.panel-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.panel-header h2{margin:0;font-size:var(--type-section-size);font-weight:700;line-height:var(--type-section-line);text-transform:uppercase;letter-spacing:var(--type-section-track)}.panel-actions{display:flex;align-items:center;gap:6px;flex-wrap:nowrap}.panel-actions-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.ghost-button{border:0;border-radius:8px;height:36px;padding:0 12px;background:#ffffff0d;color:#ffffffb3;font-size:13px;font-weight:500;cursor:pointer;transition:background .14s ease,color .14s ease}.ghost-button:hover{background:#ffffff17;color:#ffffffeb}.ghost-button-light{background:#ffffff0d;color:#ffffffb3}.ghost-button-light:hover{background:#ffffff17}.ghost-button-icon{width:36px;min-width:36px;height:36px;min-height:36px;padding:0;border-radius:8px;display:inline-grid;place-items:center;background:#ffffff0d}.ghost-button-icon:hover{background:#ffffff17;color:#fff}.ghost-button-icon svg{width:16px;height:16px;display:block}.menu-wrap{position:relative}.actions-menu{position:absolute;top:calc(100% + 8px);right:0;min-width:132px;padding:6px;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:#262626;box-shadow:0 18px 32px #0000005c;z-index:10}.actions-menu-item{width:100%;height:32px;padding:0 10px;border:0;background:transparent;color:#ffffffc7;display:flex;align-items:center;gap:8px;cursor:pointer;text-align:left}.actions-menu-item:hover{background:#ffffff14}.actions-menu-item svg{width:14px;height:14px;flex:0 0 auto}.actions-menu-item span{font-size:var(--font-size-12);line-height:var(--line-height-tight)}.control-slider{--slider-progress: 50%;--slider-preview-start: 50%;--slider-preview-width: 0%;grid-column:1 / -1;position:relative;display:grid;gap:0;cursor:pointer}.control-slider[data-cursor-mode=resize]{cursor:ew-resize}.control-slider-label{color:#ffffffb3;font-size:13px;font-weight:500;line-height:1.5;letter-spacing:0}.control-slider-value{color:#ffffffb3;font-size:13px;font-weight:400;line-height:1.5;letter-spacing:0}.control-slider:hover .control-slider-label,.control-slider:hover .control-slider-value,.control-slider:focus-within .control-slider-label,.control-slider:focus-within .control-slider-value{color:#fff}.control-slider-track{position:relative;height:36px;display:block;overflow:hidden;border-radius:8px;background:#2e2e2e}.control-slider-track:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:transparent}.control-slider-fill,.control-slider-preview,.control-slider-thumb{position:absolute;pointer-events:none}.control-slider-fill{left:0;top:0;width:var(--slider-progress);height:100%;background:#ffffff1c;transition:background .16s ease}.control-slider:hover .control-slider-fill{background:#ffffff24}.control-slider-preview{left:var(--slider-preview-start);top:0;width:var(--slider-preview-width);height:100%;background:#ffffff09;opacity:0}.control-slider[data-hovering=true] .control-slider-preview{opacity:1}.control-slider-thumb{top:50%;left:calc(var(--slider-progress) - 8px);width:3px;height:20px;border-radius:999px;background:#fff3;transform:translateY(-50%);opacity:0}.control-slider[data-hovering=true] .control-slider-thumb,.control-slider:focus-within .control-slider-thumb{opacity:1}.control-slider-input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;opacity:0;cursor:inherit;z-index:2}.control-slider-input:focus-visible{outline:none}.control-slider-content{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 10px;pointer-events:none}.canvas-stage{position:relative;width:var(--canvas-width, 500px);min-width:var(--canvas-width, 500px);min-height:var(--canvas-height, 500px);height:var(--canvas-height, 500px);border-radius:0;overflow:hidden;display:grid;place-items:center;background:transparent;box-shadow:none}.canvas-stage canvas{display:block;width:var(--canvas-width, 500px);height:var(--canvas-height, 500px);min-width:var(--canvas-width, 500px);max-height:var(--canvas-height, 500px);object-fit:contain;image-rendering:pixelated}.layout-group{display:grid;gap:6px;margin-bottom:10px}.layout-group-title{margin:0;color:#ffffffb3;font-size:13px;font-weight:600;line-height:1.5;letter-spacing:-.13px}.inspector-input-group{display:grid;gap:6px}.inspector-input-pair{display:grid;grid-template-columns:1fr 1fr;gap:6px}.inspector-input{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:36px;padding:0 10px;border-radius:8px;background:#ffffff0d;transition:background .14s ease}.inspector-input:hover,.inspector-input:focus-within{background:#ffffff14}.inspector-input-label{color:#ffffffb3;font-size:13px;font-weight:400;line-height:1.5;white-space:nowrap}.inspector-input input{width:72px;border:0;background:transparent;color:#ffffffb3;font-size:13px;font-weight:400;line-height:1.5;text-align:right;outline:none;-webkit-appearance:textfield;appearance:textfield;-moz-appearance:textfield}.inspector-input:hover input,.inspector-input:focus-within input{color:#fff}.inspector-input input::-webkit-outer-spin-button,.inspector-input input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}.inspector-input--compact input{width:48px}.inspector-input--full{width:100%}.inspector-input--full input{width:72px}.status-text{position:absolute;left:0;bottom:0;margin:0;font-size:13px;line-height:var(--line-height-copy);color:#111111b8}.status-text[data-error=true]{color:#8a1b10}.controls-grid{display:grid;grid-template-columns:1fr;gap:16px}.controls-group{display:grid;gap:6px;padding-top:4px;border-top:1px solid var(--line)}.controls-group:first-child{padding-top:0;border-top:0}.controls-group-title{margin:0 0 6px;color:#fff;font-size:13px;font-weight:600;line-height:1.5;letter-spacing:-.13px}.control,.toggle-control{display:grid;gap:8px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}.control-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.control-head>span,.toggle-control span{font-size:var(--type-label-size);font-weight:700;line-height:var(--type-label-line);letter-spacing:var(--type-label-track)}.control output,.toggle-control output,.control-head output{font-size:var(--type-meta-size);font-weight:500;line-height:var(--type-meta-line);letter-spacing:0;color:var(--muted)}.toggle-control{grid-template-columns:1fr auto;align-items:center;min-height:52px}.toggle-control input{width:18px;height:18px}input[type=range]{width:100%;accent-color:#ffffff}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media (max-width: 920px){.app-title{position:absolute;top:24px;left:0;z-index:2}.workspace{min-height:calc(100vh - 52px);display:grid;grid-template-columns:1fr;gap:24px;align-items:start;padding-top:28px}.sidebar-panel{position:static;width:auto;border:1px solid rgba(255,255,255,.1);background:#212121}.canvas-workspace{min-height:auto;padding-bottom:56px}.canvas-panel{min-height:0;padding:0}.sidebar-panel-inner{height:auto;overflow:visible;padding:10px 12px 12px}.status-text{position:static;margin-top:8px}}@media (max-width: 640px){.page-shell{width:min(100% - 18px,1180px);padding-top:18px}.app-title{top:18px;left:0}.canvas-workspace{padding:16px}.controls-grid{grid-template-columns:1fr}.panel-actions-grid{width:100%;grid-template-columns:36px;justify-content:end}.canvas-stage{width:min(100%,var(--canvas-width, 500px));min-width:0;min-height:min(100vw - 74px,var(--canvas-height, 500px));height:min(100vw - 74px,var(--canvas-height, 500px))}.canvas-stage canvas{width:100%;min-width:0;height:100%}}@media (forced-colors: active){.control-slider-track:before{forced-color-adjust:auto;background:Canvas}.control-slider-fill,.control-slider-preview{background:Highlight}.control-slider-label,.control-slider-value{color:CanvasText}.control-slider-thumb{background:CanvasText}}