.composition-editor{min-height:560px}.composition-editor .app-header{flex-shrink:0;gap:24px!important;height:60px!important}.sliick-lockup{flex-shrink:0;align-items:center;gap:12px;display:flex}.sliick-lockup h1{align-items:center;margin:0;line-height:1;display:flex}.sliick-lockup h1 img{width:76px;height:auto;display:block}.sliick-by-liinks{color:#8d8398;background:#faf9fc;border:1px solid #e9e6ee;border-radius:20px;align-items:center;gap:5px;padding:5px 8px;display:flex}.sliick-by-liinks span{font-size:10px}.sliick-by-liinks img{opacity:.65;width:44px;height:13px}.editor-header-tools{flex:1;align-items:center;gap:10px;display:flex}.editor-header-tools>button{background:#fff;border-color:#e7e6ed;gap:8px;height:33px;font-size:12px}.editor-header-tools>button[aria-expanded=true]{color:#64518d;background:#efebfb;border-color:#d9cdea}.history-buttons{border-left:1px solid #e8e7ed;gap:2px;padding-left:12px;display:flex}.history-buttons button{color:#73717e;width:30px;height:30px}.editor-workbench{flex:1;grid-template-columns:200px minmax(0,1fr) 288px;min-height:0;display:grid}.objects-panel{background:#fff;border-right:1px solid #e9e8ee;flex-direction:column;min-height:0;display:flex}.panel-heading{border-bottom:1px solid #efedf3;flex-shrink:0;justify-content:space-between;align-items:center;gap:10px;min-height:58px;padding:0 20px;font-size:12px;font-weight:600;display:flex}.panel-heading>div{align-items:center;gap:9px;min-width:0;display:flex}.panel-heading>div>span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.panel-heading svg{flex-shrink:0;width:15px;height:15px}.panel-heading button{width:28px;height:28px}.inspector-selection{flex:1;align-items:center;gap:9px;min-width:0;display:flex;position:relative}.inspector-selection select{appearance:none;min-width:0;height:32px;color:inherit;font:inherit;text-overflow:ellipsis;cursor:pointer;background:0 0;border:0;border-radius:4px;flex:1;padding:0 22px 0 0}.inspector-selection select:hover{color:#78608f}.inspector-selection .selection-chevron{pointer-events:none;color:#93829d;width:13px;height:13px;position:absolute;right:2px}.object-count{color:#807b8c;background:#f4f3f7;border-radius:5px;place-items:center;min-width:22px;height:22px;font-size:12px;display:grid}.object-list{padding:10px 8px;overflow-y:auto}.object-row{color:#6b6678;border-radius:6px;align-items:center;min-height:39px;margin:2px 0;display:flex;position:relative}.object-row.selected{color:#64518d;background:#efebfb}.object-row.is-hidden .object-select{opacity:.45}.object-select{text-align:left;cursor:pointer;flex:1;align-items:center;gap:9px;min-width:0;padding:10px 8px;font-size:12px;display:flex}.object-select span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.object-select svg{color:#92889f;flex-shrink:0;width:15px;height:15px}.object-visibility{opacity:.5;cursor:pointer;flex-shrink:0;place-items:center;width:28px;height:30px;display:grid}.object-visibility:hover{opacity:1}.object-visibility svg{width:13px;height:13px}.object-lock-indicator{background:#efebfb;width:9px;height:9px;position:absolute;bottom:6px;left:19px}.scene-settings-link{text-align:left;color:#6b6678;cursor:pointer;border-top:1px solid #efedf3;align-items:center;gap:9px;margin:5px 8px;padding:13px 9px;font-size:12px;display:flex}.scene-settings-link.selected{color:#64518d;background:#f4f1fc;border-radius:6px}.scene-settings-link svg{width:15px;height:15px}.eyebrow{letter-spacing:.1em;color:#8c8397;font-size:12px;font-weight:500}.editor-stage{background:#f5f4f8;flex-direction:column;min-width:0;min-height:0;display:flex;position:relative}.editor-stage-heading{color:#847c90;flex-shrink:0;justify-content:flex-end;align-items:center;gap:14px;height:58px;padding:0 24px;font-size:12px;display:flex}.canvas-format select{color:#82778f;cursor:pointer;background:0 0;border:0;max-width:130px;padding:6px 2px;font-size:12px}.editor-canvas-space{flex:1;justify-content:center;align-items:center;min-width:0;min-height:0;margin:0 20px;display:flex}.composition-editor .artboard{border-radius:3px;flex-shrink:0;overflow:hidden;box-shadow:0 6px 25px #3d254812}.composition-editor .viewport,.composition-editor .viewport canvas{touch-action:none}.canvas-toolbar{flex-shrink:0;justify-content:center;align-items:center;gap:17px;height:72px;display:flex}.tool-switch{background:#fff;border:1px solid #e8e3ef;border-radius:9px;gap:3px;padding:4px;display:flex;box-shadow:0 3px 8px #38244204}.tool-switch button{color:#80748f;cursor:pointer;border-radius:5px;align-items:center;gap:6px;height:30px;padding:0 11px;font-size:12px;display:flex}.tool-switch button[aria-pressed=true]{color:#fff;background:#302a3e}.tool-switch svg{width:13px;height:13px}.canvas-hint{color:#796b85;font-size:12px}.rotation-controls{border-left:2px solid #e9e3f2;margin:16px 0;padding-left:12px}.shape-library{color:#332c40;background:#fff;border:1px solid #e7e2ee;border-radius:16px;width:min(560px,100vw - 28px);max-height:calc(100dvh - 48px);margin:auto;padding:24px;overflow-y:auto;box-shadow:0 24px 100px #24123030}.shape-library::backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#24183240}.shape-library-heading{justify-content:space-between;align-items:center;gap:20px;display:flex}.shape-library h2{letter-spacing:-.8px;margin-top:5px;font-size:24px;font-weight:550}.shape-library>p{color:#81758e;margin:10px 0 16px;font-size:12px}.shape-library-section+.shape-library-section{margin-top:18px}.shape-library-section h3{color:#53495e;justify-content:space-between;align-items:baseline;gap:10px;margin:0 0 10px;font-size:12px;font-weight:600;display:flex}.shape-library-section h3>span{color:#94849f;font-size:11px;font-weight:400}.shape-library-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;display:grid}.shape-library-featured .shape-library-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.shape-library-grid>button{text-align:center;cursor:pointer;background:#faf9fc;border:1px solid #eeeaf3;border-radius:10px;flex-direction:column;align-items:center;gap:8px;padding:10px 8px;transition:background .15s,border-color .15s;display:flex;position:relative}.shape-library-grid>button:hover{background:#f2edf9;border-color:#baa9d2}.shape-library-grid>button:focus-visible{outline-offset:3px;outline:2px solid #987db6}.shape-library-grid>button>span{font-size:12px;line-height:1.4}.shape-library-grid>button>svg{color:#a292b5;width:12px;height:12px;position:absolute;top:8px;right:8px}.shape-swatch{place-items:center;width:74px;height:50px;display:grid}.shape-swatch span{background:linear-gradient(130deg,#e0d5ed,#aa90c2);width:48px;height:48px;display:block;box-shadow:6px 7px 12px #61477518}.shape-sphere span{background:radial-gradient(circle at 28% 24%,#ede6f5,#b29bc8 66%,#947caf);border-radius:50%}.shape-cube span{border-top:7px solid #e2d5ee;border-right:9px solid #9b80b4;width:40px;height:40px;transform:rotate(-18deg)skew(8deg,8deg)}.shape-torus span{background:0 0;border:13px solid #ad92c4;border-color:#c6b0da #ad92c4 #ad92c4 #c6b0da;border-radius:50%}.shape-cylinder span{background:linear-gradient(90deg,#d7c5e7,#b497cb);border-top:8px solid #e8def1;border-radius:50%/15%;width:39px}.shape-cone span{clip-path:polygon(50% 0,100% 90%,84% 100%,16% 100%,0 90%)}.shape-disc span{border-bottom:6px solid #a88dbf;border-radius:50%;height:36px;transform:rotate(-25deg)}.shape-gem span{clip-path:polygon(50% 0,90% 22%,100% 68%,50% 100%,0 68%,10% 22%);background:conic-gradient(from 20deg at 55%,#c2aad5,#9d82b6,#e4d8ef,#b397c9)}.shape-arch span{background:0 0;border:13px solid #c6b0da;border-bottom:0;border-radius:40px 40px 0 0;height:37px}.shape-featured svg{width:64px;height:50px}.shape-library>.shape-library-note{margin:16px 0 0;font-size:11px}@media (max-width:480px){.shape-library{padding:20px}.shape-library-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.shape-library-section h3>span{font-size:10px}}@media (max-width:1200px){.canvas-hint{display:none}}@media (max-width:700px){.composition-editor .app-header{gap:12px!important}.sliick-lockup{gap:7px}.sliick-lockup h1 img{width:66px}.sliick-by-liinks{padding:4px 6px}.sliick-by-liinks img{width:34px;height:10px}.editor-header-tools{gap:5px}.editor-header-tools>button{width:32px;padding:0}.editor-header-tools>button>span,.editor-header-tools>button>svg:last-child:not(:first-child){display:none}.history-buttons{border:0;gap:0;padding-left:0}.history-buttons button{width:26px}}@media (max-width:380px){.sliick-by-liinks{display:none}}@media (min-width:701px) and (max-width:820px){.editor-header-tools>button{width:33px;padding:0}.editor-header-tools>button>span,.editor-header-tools>button>svg:last-child:not(:first-child){display:none}}.editor-motion-bar{color:#534461;background:#fff;border-top:1px solid #ded6e8;flex-shrink:0;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:20px;min-height:88px;padding:14px 20px;font-size:12px;display:grid;box-shadow:0 -4px 18px #39214906}.footer-control{min-width:0}.footer-label{color:#534461;align-items:center;gap:7px;min-height:18px;margin-bottom:7px;font-size:12px;font-weight:600;display:flex}.footer-label>label{margin-right:auto}.footer-label svg{color:#8d70a6;flex-shrink:0;width:14px;height:14px}.footer-control-row{align-items:center;gap:7px;display:flex}.footer-control-row select{color:#554565;cursor:pointer;background:#f6f3fa;border:1px solid #e4dcec;border-radius:7px;flex:1;min-width:0;height:35px;padding:0 9px;font-size:12px;font-weight:500}.footer-control-row select:hover{border-color:#b9a4ce}.has-motion #scene-motion{color:#68428e;background:#eee6f8;border-color:#ceb8e1}.footer-control-row button{color:#72528e;background:#fff;border-color:#ded2e9;flex-shrink:0;width:35px;height:35px}.footer-control-row button svg{width:14px;height:14px}.footer-note{color:#897793;margin-top:7px;font-size:10px}.footer-frame-export{color:#806391;cursor:pointer;white-space:nowrap;background:0 0;border:0;align-items:center;gap:4px;padding:0;font-size:10px;font-weight:500;display:inline-flex}.footer-frame-export:hover{color:#4e3269}.footer-frame-export svg{width:12px;height:12px}.editor-inspector.inspector{background:#fff;border-left:1px solid #e9e5ef;min-height:0;display:block;overflow-y:auto}.editor-inspector .panel-heading{z-index:2;background:#fff;position:sticky;top:0}.editor-section{border-bottom:1px solid #efedf3;padding:20px}.editor-section h3{color:#53495e;margin:0 0 16px;font-size:12px;font-weight:600}.editor-control{color:#797080;margin:19px 0 0;font-size:12px;display:block}.editor-control>span{justify-content:space-between;gap:12px;margin-bottom:11px;display:flex}.editor-control output{font-variant-numeric:tabular-nums;color:#796b85;font-size:12px}.editor-control input{accent-color:#8d7bae;cursor:pointer;width:100%;height:4px;margin:0 0 5px;display:block}.editor-select-field{color:#797080;justify-content:space-between;align-items:center;gap:12px;margin-top:15px;font-size:12px;display:flex}.editor-select-field select{color:#786584;background:#faf9fc;border:1px solid #e9e3ee;border-radius:5px;max-width:145px;padding:6px 8px;font-size:12px}.editor-segments{background:#f7f5f9;border:1px solid #eee9f2;border-radius:6px;gap:3px;padding:3px;display:flex}.editor-segments button{color:#897a95;cursor:pointer;border-radius:4px;flex:1;padding:7px 3px;font-size:12px}.editor-segments button[aria-pressed=true]{color:#51435f;background:#fff;box-shadow:0 1px 4px #2b163315}.editor-segments button:hover{background:#fff}.color-field{color:#797080;align-items:center;gap:9px;font-size:12px;display:flex}.color-field>span:first-child{flex:1}.color-field>span:last-child{color:#796b85;min-width:58px;font-size:12px}.color-field input{cursor:pointer;background:0 0;border:0;border-radius:5px;width:25px;height:25px;padding:0}.color-field input::-webkit-color-swatch-wrapper{padding:0}.color-field input::-webkit-color-swatch{border:1px solid #0001;border-radius:5px}.editor-checkbox{color:#797080;justify-content:space-between;align-items:center;margin-top:16px;font-size:12px;display:flex}.editor-checkbox input{accent-color:#8d7bae;width:14px;height:14px}.position-details{margin-top:20px}.position-details summary{color:#93829d;cursor:pointer;font-size:12px}.position-inputs{gap:10px;margin-top:12px;display:flex}.position-inputs label{color:#796b85;align-items:center;gap:6px;min-width:0;font-size:12px;display:flex}.position-inputs input{color:#766181;background:#faf9fc;border:1px solid #e9e2ef;border-radius:5px;width:100%;min-width:0;padding:7px}.editor-text-action{color:#796b85;cursor:pointer;align-items:center;gap:5px;margin-top:14px;font-size:12px;display:flex}.editor-text-action:hover{color:#614877}.editor-text-action svg{width:11px;height:11px}.object-properties:disabled{opacity:.5}.object-actions{gap:8px;display:flex}.object-actions button{height:30px;box-shadow:none;color:#8b749a;border-color:#e9e3ee;padding:0 9px;font-size:12px}.object-actions button svg{width:12px;height:12px}.editor-inspector .screen-section{border-bottom:1px solid #efedf3;padding:20px}.editor-inspector .section-title{margin-bottom:14px}.editor-inspector .section-title h2{color:#53495e;font-size:12px}.editor-inspector .small-label{font-size:12px}.editor-inspector .upload-card{background:#fcfbfd;border-style:dashed;border-color:#dbd4e4;gap:10px;padding:11px}.editor-inspector .screen-thumbnail{width:30px;height:54px}.editor-inspector .upload-copy strong{font-size:12px;font-weight:500;line-height:1.5}.editor-inspector .upload-copy>span{font-size:12px;line-height:1.5}.editor-inspector .upload-card>svg{color:#a995b7;width:14px;height:14px}.editor-inspector .capture-note{color:#796b85;font-size:12px;line-height:1.6}.editor-inspector .field-label,.editor-inspector .switch-row{color:#897a95;font-size:12px}.editor-inspector .field-label output{font-size:12px}.editor-inspector .island-fit-action{color:#796b85;font-size:12px}.editor-inspector .sample-action,.editor-inspector .filename{font-size:12px}.editor-inspector [data-slot=slider-range]{background:#9b85b0}.editor-inspector [data-slot=slider-thumb]{border-color:#aa94bd}.palette-options{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.palette-options button{cursor:pointer;border:2px solid #fff;border-radius:6px;height:26px;display:flex;position:relative;overflow:hidden;box-shadow:0 0 0 1px #ece5f1}.palette-options button[aria-pressed=true]{box-shadow:0 0 0 1px #8e71a6}.palette-options button:disabled{opacity:.3;cursor:default}.palette-options span{flex:1}.palette-options svg{color:#fff;filter:drop-shadow(0 1px 2px #0009);width:12px;height:12px;position:absolute;top:5px;right:4px}.editor-note{color:#796b85;margin-top:14px;font-size:12px;line-height:1.6}.object-selection{pointer-events:none;z-index:2;border:1px solid #9572dc;position:absolute}.object-selection[hidden]{display:none}.object-selection.is-locked{border-style:dashed}.object-selection.is-locked .object-handle{display:none}.object-handle{pointer-events:auto;touch-action:none;background:#fff;border:1px solid #9572dc;width:9px;height:9px;position:absolute}.object-handle:after{content:"";position:absolute;inset:-8px}.handle-nw{cursor:nwse-resize;top:-5px;left:-5px}.handle-ne{cursor:nesw-resize;top:-5px;right:-5px}.handle-sw{cursor:nesw-resize;bottom:-5px;left:-5px}.handle-se{cursor:nwse-resize;bottom:-5px;right:-5px}.handle-rotate{cursor:grab;border-radius:50%;top:-25px;left:calc(50% - 5px)}.handle-rotate:before{content:"";background:#9572dc;width:1px;height:15px;position:absolute;top:8px;left:3px}.preset-drawer{background:#fff;border:0;border-right:1px solid #e2dce9;width:min(460px,100vw);max-width:100%;height:100dvh;max-height:none;margin:0;padding:0;position:fixed;inset:0 auto 0 0;box-shadow:8px 0 60px #27173222}.preset-drawer::backdrop{background:#2a203638}.preset-drawer-content{padding:27px 24px}.preset-drawer-heading{justify-content:space-between;align-items:center;gap:20px;display:flex}.preset-drawer-heading h2{letter-spacing:-.04em;color:#30263d;margin-top:6px;font-size:23px}.preset-drawer-heading button{color:#796b85;width:30px;height:30px}.preset-description{color:#796b85;max-width:330px;margin:15px 0 22px;font-size:12px;line-height:1.8}.device-only-preset{text-align:left;color:#796b85;cursor:pointer;border:1px solid #eae3f1;border-radius:10px;align-items:center;gap:14px;width:100%;margin-bottom:24px;padding:15px;display:flex}.device-only-preset>svg:first-child{width:22px;height:26px}.device-only-preset>div{flex-direction:column;flex:1;gap:5px;display:flex}.device-only-preset strong{color:#6b557e;font-size:12px;font-weight:500}.device-only-preset span{font-size:12px}.device-only-preset>svg:last-child:not(:first-child){width:14px;height:14px}.preset-grid{grid-template-columns:1fr 1fr;gap:22px 14px;display:grid}.preset-tile{text-align:left;cursor:pointer;min-width:0}.preset-tile>div{aspect-ratio:640/520;outline-offset:3px;border-radius:9px;outline:1px solid #3018400c;place-items:center;display:grid;overflow:hidden}.preset-tile.active>div,.device-only-preset.active{outline-offset:3px;outline:2px solid #b19cc6}.preset-tile:hover>div{outline-color:#a080bb}.preset-tile img{object-fit:cover;width:100%;height:100%}.preset-tile>div>svg{color:#fff8;width:26px;height:26px}.preset-tile>span{color:#655075;justify-content:space-between;align-items:center;margin:10px 0 4px;font-size:12px;display:flex}.preset-tile>span svg{width:12px;height:12px}.preset-tile small{color:#796b85;font-size:12px}.simple-looks{color:#796b85;margin-top:28px;font-size:12px}.simple-looks summary{cursor:pointer;margin-bottom:12px}.simple-looks button{cursor:pointer;border:1px solid #e9e1ef;border-radius:5px;margin:3px;padding:7px 10px;font-size:12px}.composition-editor button:focus-visible,.composition-editor input:focus-visible,.composition-editor select:focus-visible{outline-offset:3px;outline:2px solid #9774c0}.mobile-close,.mobile-objects-trigger{display:none!important}@media (max-width:1100px){.editor-workbench{grid-template-columns:170px minmax(0,1fr) 260px}.panel-heading,.editor-section,.editor-inspector .screen-section{padding-left:16px;padding-right:16px}.canvas-hint{display:none}.editor-stage-heading{padding:0 18px}}@media (max-width:820px){.editor-workbench{grid-template-columns:minmax(0,1fr) 270px}.objects-panel{display:none}.mobile-objects-trigger{display:inline-flex!important}.objects-panel.mobile-open{z-index:10;width:240px;display:flex;position:absolute;top:60px;bottom:0;left:0;box-shadow:10px 0 40px #26133220}.objects-panel.mobile-open .mobile-close{display:flex!important}.editor-header-tools{gap:8px}.history-buttons{padding-left:6px}.composition-editor .app-header{gap:14px!important}.composition-editor .wordmark a,.composition-editor .wordmark h1 span{display:none}}@media (max-width:600px){.studio-app.composition-editor{height:100dvh;min-height:560px;overflow:hidden}.composition-editor .app-header{gap:9px!important;height:54px!important;padding:0 10px!important}.composition-editor .wordmark h1{font-size:16px!important}.editor-header-tools>button{gap:4px;height:30px;padding:0 7px;font-size:12px}.editor-header-tools>button svg{width:12px;height:12px}.editor-header-tools>button svg:last-child{display:none}.history-buttons{border:0;gap:0;padding:0}.history-buttons button{width:25px;height:29px}.history-buttons svg{width:13px;height:13px}.composition-editor .app-header .export-button{gap:5px;height:31px!important;padding:0 8px!important;font-size:12px!important}.composition-editor .export-button svg{width:13px;height:13px}.editor-workbench{grid-template-rows:minmax(250px,1fr) minmax(185px,34dvh);grid-template-columns:1fr;display:grid}.editor-stage-heading{height:35px;padding:0 18px;font-size:12px}.editor-canvas-space{margin:0 12px}.canvas-toolbar{gap:10px;height:48px}.tool-switch{padding:3px}.tool-switch button{height:25px;font-size:12px}.editor-motion-bar{gap:14px;min-height:80px;padding:10px 16px}.editor-inspector.inspector{border-top:1px solid #e4ddea;border-left:0;border-radius:14px 14px 0 0;overflow-y:auto;box-shadow:0 -6px 25px #3b224206}.editor-inspector .panel-heading{min-height:44px}.objects-panel.mobile-open{top:54px;bottom:0}}@container studio (min-width:601px) and (max-width:700px){.composition-editor.is-compact .editor-workbench{grid-template-columns:minmax(0,1fr) 260px}.composition-editor.is-compact .objects-panel:not(.mobile-open){display:none}.composition-editor.is-compact .mobile-objects-trigger{display:flex!important}}@media (max-width:600px){.studio-app.composition-editor.is-compact{height:100dvh;overflow:hidden}.composition-editor.is-compact .editor-inspector.inspector{border-top:1px solid #e4ddea;border-left:0;display:block;overflow-y:auto}}.composition-editor .position-details:first-child{margin-top:0}@media (max-width:420px){.composition-editor .app-header .export-button{width:32px;min-width:32px;padding:0!important}.composition-editor .app-header .export-button span{display:none}}
