:root{font-family:system-ui,-apple-system,"Segoe UI",sans-serif;--ui-bg:#141517;--ui-panel:#1c1d20;--ui-line:#303236;--ui-text:#e6e7ea;--ui-muted:#989ba3;--ui-accent:#a7a4ff;color:var(--ui-text);color-scheme:dark;font-size:13px}
body{background:var(--ui-bg)}button,input,select,textarea{font:inherit}button{transition:background .12s,border-color .12s}button:focus-visible,summary:focus-visible{outline:2px solid var(--ui-accent);outline-offset:2px}button:disabled{opacity:.4}.app{min-height:600px;height:100dvh}.topbar{height:52px;min-height:52px;padding:0 18px;gap:16px;background:#202124;border-color:var(--ui-line)}.brand{font-size:19px;letter-spacing:-.7px}.projectname{font-size:12px!important;font-weight:500;max-width:280px!important;width:250px;color:#d1d3d8}.topseparator{height:18px;background:var(--ui-line)}.topactions{gap:6px}.topactions .textbtn{height:30px;min-height:30px;padding:0 11px;font-size:12px;border:1px solid transparent;background:transparent;box-shadow:none}.topactions #open,.topactions #save{border-color:#3c3e44;background:#282a2e}.topactions .exportbtn{min-height:32px;height:32px;padding:0 20px;border-radius:5px;font-size:12px;background:#d6d3ff;color:#24213b;box-shadow:none}.topactions .exportbtn:hover{background:#e7e5ff}
.workspace{grid-template-columns:224px minmax(0,1fr) 306px;min-height:0}.left,.right{background:var(--ui-panel);border-color:var(--ui-line)}.sidebarhead,.inspectorhead{height:40px;font-size:11px;font-weight:600;letter-spacing:.2px;text-transform:none;padding:0 16px;color:#c4c6cd}.library-nav{margin:14px 12px 16px;padding:10px 12px;min-height:36px;border:1px solid #44434f;border-radius:5px;background:#2c2b34;color:#d7d3ff;font-size:12px;box-shadow:none}.library-nav:hover{background:#373441;border-color:#78728f}.tools{padding:0 12px 16px;gap:5px;grid-template-columns:1fr 1fr 1fr;border-color:var(--ui-line)}.tools button{min-height:32px;padding:6px 5px;font-size:10px;font-weight:500;border-radius:4px;background:#26272b;border-color:#393b40;gap:0}.tools button:hover{background:#333439}.layershead{border-bottom:1px solid var(--ui-line);margin-bottom:6px}.layers{padding:0 8px}.layer{height:36px;border-radius:4px;font-size:12px;gap:9px}.layer.chosen,.layer.chosen:hover{background:#353343;border-color:#67617e;box-shadow:none}.layer-symbol{opacity:.6}.layer-actions{gap:9px;color:#989da8}.leftbottom{padding:12px;font-size:9px;gap:5px;border-color:var(--ui-line)}.leftbottom .statusdot{display:none}.version{font-size:9px}
.stage{background:#101113}.stagebar{height:40px;padding:0 18px;border-color:var(--ui-line);font-size:11px}.stageleft{font-weight:500}.dimension{background:transparent;border:1px solid #34363b;color:#b1b4bd;font-size:10px;padding:4px 7px}.stagecenter{padding:20px;overflow:hidden;gap:12px;background:#101113}.canvas-shell{max-height:none!important;box-shadow:0 8px 32px #0006;flex-shrink:0}.stagecenter p{font-size:10px!important;margin:0;color:#777c87}.stagefooter{height:26px;padding:0 16px;border-color:var(--ui-line);color:#9297a1;font-size:10px}.stagefooter .statusdot{width:4px;height:4px;background:#8d97ad}.canvas-selection{background:transparent;border-color:#aaa7ed}.inspectorhead{height:40px;background:#202124;border-color:var(--ui-line)}.inspector{padding:12px 16px;scrollbar-width:thin;scrollbar-color:#4a4c53 transparent}.inspector-title{padding:4px 0 12px;gap:7px}.inspector-title input{font-size:12px;font-weight:600}.inspector-title #delete{font-size:10px;color:#a6a8af;padding:5px 7px;border:1px solid #3c3e43;border-radius:4px}.typechip{font-size:8px;background:#303137;color:#a7aab4;padding:4px}.property-section{border-top:1px solid var(--ui-line);padding:12px 0 4px}.property-section summary{font-size:11px;font-weight:600;cursor:pointer;margin-bottom:10px;color:#d6d8df;list-style:none;display:flex;justify-content:space-between;align-items:center}.property-section summary::-webkit-details-marker{display:none}.property-section summary:after{content:"Show";font-size:9px;font-weight:400;color:#9d9aa9}.property-section[open] summary:after{content:"Hide"}.property-section:not([open]) summary{margin-bottom:4px}.section-description{font-size:10px;line-height:1.5;color:#9196a1;margin:0 0 12px}.fieldgrid{grid-template-columns:1fr 1fr;gap:9px 10px}.right .field{font-size:10px;margin-bottom:9px;gap:8px}.fieldgrid .prop-field{display:grid;grid-template-columns:1fr 25px;gap:4px;position:relative;margin:0}.prop-field .prop-name{grid-column:1/-1;font-size:9px;letter-spacing:.2px;color:#9297a2}.right .field input[type=number],.prop-field input{width:100%!important;max-width:none!important;height:29px;padding:5px 7px;font-size:11px;background:#27292d;border-color:#3b3e44;border-radius:4px;color:#d5d8e0}.inline-key{height:29px;width:25px;border-radius:4px;background:#27292d;border:1px solid #3b3e44}.inline-key .diamond{width:7px;height:7px}.sectiontitle{font-size:11px;font-weight:600;text-transform:none;letter-spacing:0;border-color:var(--ui-line);margin:14px 0 13px;padding-top:14px}.right .field:not(.prop-field):not(.textfield) input[type=number],.right .field select{width:130px!important;max-width:150px;height:29px}.right select{border:1px solid #3b3e44;background:#27292d;border-radius:4px;padding:4px 7px;color:#d5d8e0;font-size:10px}.right .textfield{margin-top:14px}.right textarea{background:#27292d!important;border-color:#3b3e44!important;border-radius:4px!important;font-size:12px;line-height:1.5;min-height:64px;padding:9px!important}.right input[type=color]{width:44px;max-width:44px;min-height:25px;background:transparent}.keybtn{font-size:11px;background:#35333f;border:1px solid #575364;border-radius:4px;padding:8px 11px;min-height:30px}.right #applyText{width:100%;margin-top:8px;background:#d6d3ff;color:#24213b;border-color:#d6d3ff;font-weight:600}.hint{font-size:10px!important;line-height:1.6!important;color:#878d98}.compact-hint{padding-top:10px;border-top:1px solid var(--ui-line)}
.timeline-resizer{height:5px;flex:0 0 5px;background:#131416;cursor:ns-resize;border-top:1px solid #35373c;outline-offset:-2px}.timeline-resizer:hover,.timeline-resizer:focus-visible{background:#67617e}.timeline{height:var(--timeline-height,238px)!important;background:#1a1b1e;border-top:0;min-height:160px}.timeline-top{height:45px;min-height:45px;padding:0 14px;background:#202124;border-color:var(--ui-line);gap:12px}.timeline-title{font-size:11px;font-weight:600;color:#c9cbd1;margin-right:10px}.playcontrols{gap:7px}.playcontrols .iconbtn,.playbtn{height:28px;min-height:28px;font-size:10px;border-radius:4px;padding:0 10px}.playbtn{background:#3e3a50;color:#e3dfff;border:1px solid #625975}.frame-control{font-size:10px!important;color:#8e949f;display:flex;align-items:center;gap:5px}.frame-control input{width:52px!important;height:27px;background:#292b30;border:1px solid #3d4047;border-radius:4px;color:#d8dbe3;font-size:11px;padding:4px}.timecode{font-size:11px;margin-left:3px;white-space:nowrap}.timecode small{font-size:10px}.time-right{gap:12px;font-size:10px}.precision-toggle,.zoomctrl button{font-size:10px!important;height:26px;min-height:26px;border-radius:4px}.zoomctrl button{min-width:28px;width:auto;padding:0 5px}.zoomctrl>span{font-size:10px;min-width:36px}.toggle{font-size:10px}.toggle .dot{width:5px;height:5px}.time-layout{grid-template-columns:224px minmax(0,1fr);min-height:0;scrollbar-color:#4a4d54 #1b1c20}.rulerstub{height:29px;padding:8px 14px;font-size:9px;background:#202124;border-color:var(--ui-line);color:#8c929e}.ruler{height:29px;background:#202124;color:#959ba6;font-size:9px;border-color:var(--ui-line)}.tracklabel,.track{height:36px;min-height:36px;border-color:#2b2d32}.tracklabel{font-size:11px;padding:9px 12px;gap:8px}.tracklabel.focus{background:#2e2c3b;color:#dedce8;box-shadow:inset 2px 0 #a7a4d2}.track-expand{width:28px;min-width:28px;padding:0;font-size:8px;line-height:18px;color:#9992ae}.tracklabel-name{font-weight:500}.track.property-track,.tracklabel.property-label{height:30px;min-height:30px;font-size:9px}.property-keycount{font-size:9px}.clip{height:25px;top:5px;background:#353646;border-color:#505167;border-radius:4px;font-size:10px;color:#b3b5c9}.clip.selectedclip{background:#454158;border-color:#6a627e}.trackkey{width:10px;height:10px;top:10px;background:#c4c0d6;border-color:#c4c0d6}.trackkey.key-selected{background:#f1ebff;border-color:#bdb4ef;outline-color:#666075;box-shadow:none}.property-track .trackkey{top:9px;width:8px;height:8px}.keyedit{font-size:10px}.keyedit input,.keyedit select{font-size:10px;height:26px}.keyedit #keyRemove{width:auto;padding:0 6px;font-size:9px}.keynotice{font-size:10px}.playhead{background:#ccc8e7;width:1px}.playhead-handle .head-grip{background:#ccc8e7!important}
.template-library{width:min(1030px,calc(100vw - 48px));border-radius:10px;background:#1c1d20;border-color:#42444a}.template-library::backdrop{background:#07080bb8;backdrop-filter:blur(4px)}.library-header{padding:28px 30px 22px}.library-eyebrow{font-size:9px;letter-spacing:1.6px;color:#8f939f}.library-header h2{font-size:25px;letter-spacing:-.6px}.library-description{font-size:12px}.library-close{width:auto;height:30px;padding:0 12px;border-radius:5px;font-size:11px;background:#292b30;border-color:#41444c}.library-toolbar{margin:0 30px 22px;border-color:#34363c}.library-search input{background:#25272b;border-color:#41444b;font-size:12px}.template-cards{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));padding:0 30px 24px;gap:20px}.template-card{background:#25262b;border-color:#3b3e46;border-radius:7px;max-width:320px}.template-poster{height:250px;background:#30312f;background-image:none;padding:20px}.template-category{font-size:9px;padding:5px 8px;background:#1c1d20e8;border:1px solid #4a4d45;border-radius:4px}.template-card-body{padding:17px}.template-name-row h3{font-size:16px;font-weight:600}.template-card-body p{font-size:11px}.use-template{justify-content:center;background:#d6d3ff;color:#24213b;border-radius:4px;font-size:11px;min-height:34px;margin-top:17px}.use-template:hover{background:#e6e3ff}.library-footer{border-color:#34363c;font-size:10px;padding:17px 30px}.modal{background:#232428;border-color:#45474e;border-radius:9px;padding:25px;box-shadow:0 20px 90px #0008}.modalheader h2{font-size:18px;font-weight:600}.modalheader #close{font-size:11px;border:1px solid #45474e;border-radius:4px;padding:6px 10px}.modaloption{background:#2c2e34;border-color:#45474f;border-radius:5px}.modaloption:hover{border-color:#a7a0bc}.option-tag{font-size:10px;font-style:normal;color:#d6d3ed}.exportspec{border:1px solid #3c3e45;background:#1c1d21}.modal p{font-size:11px}
.inspector .fieldgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 10px}.inspector .prop-field{display:grid;grid-template-columns:minmax(0,1fr) 25px;gap:4px}.inspector .prop-field .prop-name{grid-column:1/-1;white-space:normal;font-size:9px}.inspector .prop-field input{width:100%!important;max-width:none!important}.inspector .prop-field .inline-key{width:25px;height:29px}
@media(min-width:981px){.workspace{grid-template-rows:minmax(0,1fr);overflow:hidden}.workspace>.stage,.workspace>.left,.workspace>.right{min-height:0;max-height:100%;height:100%}}
@media(min-width:981px) and (max-width:1150px){.workspace{grid-template-columns:190px minmax(0,1fr) 280px}.time-layout{grid-template-columns:190px minmax(0,1fr)}.time-right{gap:6px}.timeline-title{display:none}.topbar{gap:10px}}
@media(max-width:980px){.app{height:auto;min-height:100dvh}.topbar{height:auto;min-height:52px}.workspace{display:flex}.timeline-resizer{display:none}.timeline{height:300px!important}.stagecenter{overflow:visible}.stage{min-height:440px}.time-layout{grid-template-columns:180px minmax(0,1fr)}.right .field input[type=number]{font-size:16px}.template-card{max-width:none}.library-footer{flex-wrap:wrap}.leftbottom{display:none}}
@media(max-width:620px){.topbar{padding:10px 12px}.topactions .textbtn,.topactions .exportbtn{height:36px;min-height:36px}.projectname{max-width:none!important}.timeline-top{height:auto;padding:10px;flex-wrap:wrap}.timeline-title{display:none}.playcontrols{flex-wrap:wrap}.time-right{gap:8px}.time-layout{grid-template-columns:136px minmax(0,1fr)}.tools button{min-height:38px}.library-header{padding:24px 20px}.library-toolbar{margin:0 20px 18px}.template-cards{padding:0 20px 20px}.library-footer{padding:16px 20px}.template-library{width:calc(100vw - 24px)}.stagebar,.stagefooter{padding:0 12px}}
