:root{--bg:#f6f7f9;--surface:#fff;--text:#14151a;--muted:#6e727d;--border:#e1e3e8;--accent:#4734ed;--accent2:#6757ff;--success:#59aa45;--warn:#d99000;--shadow:0 12px 30px rgba(22,25,40,.08);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:var(--bg)}*{box-sizing:border-box}body{margin:0;min-width:320px;overflow:hidden}button,input,select{font:inherit;color:inherit}button{cursor:pointer}.topbar{height:64px;background:#fff;border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 20px;gap:28px}.brand{display:flex;align-items:center;gap:11px;color:inherit;text-decoration:none;font-size:23px;letter-spacing:-.7px;min-width:315px}.brand-mark{width:31px;height:31px;background:linear-gradient(145deg,#725fff,#3423df);border-radius:7px;position:relative;box-shadow:0 5px 12px rgba(71,52,237,.25)}.brand-mark i{position:absolute;border:2px solid #fff;border-radius:3px;width:16px;height:18px;left:5px;top:7px}.brand-mark i+ i{left:10px;top:4px;opacity:.6}.project-title{display:flex;gap:14px;align-items:center;flex:1;font-size:13px}.project-title span:first-child{color:var(--muted)}.project-title input{border:0;border-bottom:1px solid transparent;padding:5px 2px;width:220px;font-weight:600}.project-title input:focus{outline:0;border-color:var(--accent)}.saved{color:var(--muted)}.saved b{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--success);margin-right:6px}.primary,.secondary{border:0;border-radius:7px;padding:11px 18px;font-weight:700}.primary{background:linear-gradient(180deg,var(--accent2),var(--accent));color:#fff;box-shadow:0 5px 12px rgba(71,52,237,.18)}.primary:hover{filter:brightness(1.08)}.secondary{background:#f0efff;color:var(--accent)}.full{width:100%}.large{padding:14px}.app-shell{height:calc(100vh - 102px);display:grid;grid-template-columns:330px minmax(430px,1fr) 330px;background:#fff}.files-panel,.settings-panel{overflow:auto;background:#fff}.files-panel{border-right:1px solid var(--border)}.settings-panel{border-left:1px solid var(--border);padding:22px 20px}.settings-panel>h2{font-size:15px;margin:0 0 24px}.tabs{height:66px;display:flex;border-bottom:1px solid var(--border)}.tab{flex:1;border:0;background:#fff;color:var(--muted);border-bottom:2px solid transparent;font-size:14px}.tab small{font-size:10px}.tab.active{color:var(--accent);border-color:var(--accent);font-weight:700}.tab-content{display:none;padding:18px}.tab-content.active{display:block}.tab-content h2{font-size:15px;margin:0 0 14px}.dropzone{min-height:145px;border:1.5px dashed #ccd0d9;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;text-align:center;background:#fcfcfd;cursor:pointer;padding:18px}.dropzone.drag{border-color:var(--accent);background:#f5f3ff}.dropzone.compact{min-height:120px}.upload-icon{font-size:30px;color:var(--muted)}.dropzone strong{font-size:14px}.dropzone span:not(.upload-icon){font-size:13px}.dropzone small,.help{color:var(--muted);font-size:11px;line-height:1.5}.file-heading{display:flex;justify-content:space-between;margin:19px 0 10px;font-size:12px}.text-btn{border:0;background:none;color:var(--accent);font-size:11px}.file-list{display:flex;flex-direction:column;gap:6px;max-height:calc(100vh - 405px);overflow:auto}.file-item{display:grid;grid-template-columns:18px 22px 52px 1fr 18px;align-items:center;gap:7px;border:1px solid var(--border);border-radius:7px;padding:6px;background:#fff}.file-item.dragging{opacity:.45}.handle{color:#a0a4ae;cursor:grab;letter-spacing:-2px}.file-item img{width:52px;height:36px;border-radius:4px;object-fit:cover;background:#eee}.file-meta{min-width:0}.file-meta strong,.file-meta small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-meta strong{font-size:11px}.file-meta small{font-size:9px;color:var(--muted);margin-top:3px}.remove{border:0;background:none;color:#a7a9b1;padding:0}.validation{margin-top:14px;padding:11px;border-radius:7px;font-size:11px;line-height:1.45}.validation.neutral{background:#f4f5f7;color:var(--muted)}.validation.good{background:#f1f9ef;border:1px solid #cce6c4;color:#377b2a}.validation.warn{background:#fff8e7;border:1px solid #f1d89a;color:#855b00}.workspace{background:#fafbfc;padding:22px;overflow:auto;min-width:0}.workspace-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.workspace-head h1{font-size:15px;margin:0 0 4px}.workspace-head span{font-size:11px;color:var(--muted)}.view-controls{display:flex;gap:8px}.view-controls select,.view-controls button{height:36px;border:1px solid var(--border);background:#fff;border-radius:7px;padding:0 11px;font-size:12px}.canvas-wrap{position:relative;aspect-ratio:16/9;background:#e8e9ef;border-radius:8px;overflow:hidden;box-shadow:0 1px 0 rgba(0,0,0,.08)}canvas{width:100%;height:100%;display:block}.empty-preview{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--muted);padding:20px}.empty-preview span{font-size:42px;color:#aaaefa}.empty-preview strong{font-size:17px;color:#454852;margin-top:10px}.empty-preview p{font-size:12px;max-width:330px;line-height:1.5}.frame-badge{position:absolute;right:12px;bottom:12px;background:rgba(15,16,22,.7);color:#fff;border-radius:5px;padding:6px 9px;font-size:10px;display:none}.player{height:58px;background:#fff;border:1px solid var(--border);border-radius:8px 8px 0 0;margin-top:15px;display:flex;align-items:center;padding:0 15px;gap:13px}.player .play{border:0;background:transparent;font-size:17px}.player span{font-size:11px;color:var(--muted);white-space:nowrap}.player input{flex:1;accent-color:var(--accent)}.filmstrip{height:82px;border:1px solid var(--border);border-top:0;border-radius:0 0 8px 8px;background:#fff;padding:10px;display:flex;gap:6px;overflow:hidden}.filmstrip img{height:60px;min-width:86px;object-fit:cover;border-radius:4px;border:2px solid transparent}.filmstrip img.active{border-color:var(--accent)}.filmstrip-empty{margin:auto;color:var(--muted);font-size:11px}.tip{display:flex;gap:11px;align-items:center;border:1px solid var(--border);background:#fff;border-radius:8px;padding:13px;margin-top:16px;font-size:11px;color:var(--muted)}.tip b{border:1px solid #7182f8;color:var(--accent);border-radius:50%;width:20px;height:20px;text-align:center;line-height:18px}.field{display:block;margin-bottom:20px}.field>span{display:flex;justify-content:space-between;font-size:12px;font-weight:700;margin-bottom:9px}.field em{font-style:normal;font-weight:500;color:var(--muted)}.field input[type=range]{width:100%;accent-color:var(--accent)}.field input[type=number],.field select{width:100%;height:40px;border:1px solid var(--border);border-radius:7px;background:#fff;padding:0 11px;font-size:12px}.range-labels{display:flex;justify-content:space-between;color:var(--muted);margin-top:3px}.field-row{display:grid;grid-template-columns:1fr 1.25fr;gap:12px}.estimate{display:flex;gap:10px;border:1px solid var(--border);border-radius:7px;padding:12px;margin:-4px 0 21px;font-size:11px}.estimate>b{color:var(--success)}.estimate span>*{display:block}.estimate small{color:var(--muted);margin-top:4px}.check{display:flex;gap:9px;align-items:flex-start;margin:0 0 22px;font-size:11px}.check input{accent-color:var(--accent)}.check span>*{display:block}.check small{color:var(--muted);font-weight:400;margin-top:4px}.privacy{text-align:center;color:var(--muted);font-size:10px}.statusbar{height:38px;background:#fff;border-top:1px solid var(--border);display:flex;align-items:center;padding:0 20px;gap:28px;color:var(--muted);font-size:10px}.statusbar .local{margin-left:auto}.progress-modal{position:fixed;inset:0;z-index:30;background:rgba(14,16,24,.38);display:grid;place-items:center;backdrop-filter:blur(3px)}.progress-modal[hidden]{display:none}.progress-card{width:min(390px,calc(100vw - 32px));background:#fff;border-radius:14px;padding:30px;text-align:center;box-shadow:var(--shadow)}.spinner{width:42px;height:42px;border:4px solid #e6e4ff;border-top-color:var(--accent);border-radius:50%;margin:auto;animation:spin 1s linear infinite}.progress-card h2{font-size:18px;margin:17px 0 6px}.progress-card p{font-size:12px;color:var(--muted)}.progress-track{height:7px;background:#ececf1;border-radius:10px;overflow:hidden;margin:18px 0 8px}.progress-track i{display:block;width:0;height:100%;background:var(--accent);transition:width .2s}.progress-card>strong{font-size:11px;color:var(--muted)}.toast{position:fixed;z-index:50;left:50%;bottom:58px;transform:translate(-50%,20px);background:#171820;color:#fff;padding:11px 16px;border-radius:8px;font-size:12px;opacity:0;pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:translate(-50%,0)}@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:1050px){body{overflow:auto}.topbar{position:sticky;top:0;z-index:10}.brand{min-width:0}.project-title{display:none}.app-shell{height:auto;grid-template-columns:280px minmax(420px,1fr)}.settings-panel{grid-column:1/-1;border-left:0;border-top:1px solid var(--border);display:grid;grid-template-columns:repeat(2,1fr);gap:0 24px}.settings-panel>h2,.settings-panel>.primary,.settings-panel>.privacy{grid-column:1/-1}.statusbar{position:sticky;bottom:0}}
@media(max-width:720px){.topbar{height:58px;padding:0 12px}.brand{font-size:19px;flex:1}.topbar>.primary{padding:9px 11px;font-size:12px}.app-shell{display:flex;flex-direction:column}.files-panel{border-right:0}.file-list{max-height:300px}.workspace{padding:15px}.settings-panel{display:block}.statusbar{gap:12px;padding:0 12px;overflow:auto}.statusbar .local{display:none}.filmstrip{height:68px}.filmstrip img{height:48px;min-width:69px}.tip{display:none}}
