:root{color:#17202a;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#eef4f8;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.5}*{box-sizing:border-box}body{min-width:320px;margin:0}#root{min-height:100vh}.app-shell{color:#13201d;background:#101614;min-height:100vh;padding:24px}.topbar{justify-content:space-between;align-items:center;gap:20px;max-width:1180px;margin:0 auto 16px;display:flex}.hero-cover{color:#f7fffb;background:#111c18;border:1px solid #264239;border-radius:8px;min-height:216px;padding:30px;position:relative;overflow:hidden;box-shadow:0 8px 8px #0000003d}.hero-cover:after{content:"";pointer-events:none;z-index:1;background:linear-gradient(90deg,#111c18 0%,#111c18f0 38%,#111c1894 66%,#111c1814 100%);position:absolute;inset:0}.hero-copy{z-index:2;max-width:430px;position:relative}.eyebrow{color:#68d7c5;letter-spacing:.08em;text-transform:uppercase;margin:0 0 8px;font-size:13px;font-weight:800}.topbar h1{color:#fff;text-wrap:balance;margin:0;font-size:38px;line-height:1.1}.hero-tags{flex-wrap:wrap;gap:8px;margin-top:16px;display:flex}.hero-tags span{color:#d9fff6;background:#68d7c51f;border:1px solid #68d7c56b;border-radius:999px;align-items:center;min-height:30px;padding:0 12px;font-size:13px;font-weight:800;display:inline-flex}.hero-visual{z-index:0;width:60%;position:absolute;top:0;bottom:0;right:0}.hero-visual img{filter:saturate(1.05)contrast(1.08);object-fit:cover;object-position:center;width:100%;height:100%;display:block}.task-pill,.media-kind{color:#13201d;background:#fff;border:1px solid #d8e2df;border-radius:8px;flex:none;align-items:center;gap:8px;min-height:38px;padding:0 12px;font-size:14px;font-weight:750;display:inline-flex}.topbar .task-pill{z-index:2;background:#f7fffbf2;border-color:#ffffff9e;position:relative}.spin{animation:.9s linear infinite spin}.workspace{grid-template-columns:minmax(280px,340px) minmax(0,1fr);gap:20px;max-width:1180px;margin:0 auto;display:grid}.control-panel,.preview-panel{background:#fbfffd;border:0;border-radius:8px;box-shadow:0 8px 8px #0003}.control-panel{flex-direction:column;align-self:start;display:flex}.panel-section{border-bottom:1px solid #dfe9e5;padding:20px}.advanced-hidden,.compact-hidden{display:none!important}.panel-section:last-child{border-bottom:0}.panel-section h2,.preview-header h2,.result-box h3{color:#111827;margin:0 0 14px;font-size:17px;line-height:1.2}.section-title-row{justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;display:flex}.section-title-row h2{margin:0}.section-actions{align-items:center;gap:8px;display:flex}.section-actions button:not(.icon-button){white-space:nowrap;min-height:34px;padding:0 10px}.import-grid,.tool-row,.export-row{grid-template-columns:1fr 1fr;gap:10px;display:grid}.size-presets{grid-template-columns:repeat(4,1fr);gap:8px;margin-top:10px;display:grid}.size-presets button{background:#f8fafc;min-height:32px;padding:0 8px}.paste-zone{color:#f7fffb;cursor:pointer;background:#0f2823;border:1px solid #1b6f63;border-radius:8px;align-items:center;gap:12px;min-height:92px;margin-bottom:12px;padding:12px;transition:background .18s,border-color .18s,transform .18s;display:flex}.paste-zone:hover{background:#12322c;border-color:#45c8b4;transform:translateY(-1px)}.paste-zone:focus-visible{outline-offset:2px;outline:3px solid #14b8a647}.paste-zone svg{color:#9cf3e4;background:#68d7c524;border:1px solid #68d7c575;border-radius:8px;flex:none;width:46px;height:46px;padding:10px}.paste-zone strong,.paste-zone span{display:block}.paste-zone strong{color:#fff;font-size:16px;line-height:1.35}.paste-zone span{color:#b7eee5;margin-top:4px;font-size:12px;line-height:1.4}button{cursor:pointer;font:inherit;border:1px solid #cbd5e1;border-radius:7px;justify-content:center;align-items:center;gap:8px;min-height:40px;padding:0 12px;font-size:14px;font-weight:750;transition:border-color .18s,background .18s,color .18s,transform .18s;display:inline-flex}.icon-button{background:#f8fafc;width:36px;min-height:34px;padding:0}button:hover{border-color:#0f766e;transform:translateY(-1px)}button:disabled{cursor:not-allowed;opacity:.45;transform:none}.import-button{background:#f8fafc;min-height:74px}.hidden-input,.hidden-canvas{display:none}.link-row{background:#f6faf8;border:1px solid #cfded9;border-radius:8px;grid-template-columns:auto 1fr;align-items:center;gap:8px;margin-top:12px;padding:0 10px;display:grid}.link-row input{color:#13201d;font:inherit;background:0 0;border:0;outline:0;min-width:0;min-height:42px}.link-row button{color:#fff;background:#0f766e;border-color:#0f766e;min-height:34px}.parser-grid{flex-wrap:wrap;gap:8px;display:flex}.status-chip{color:#64748b;background:#f8fafc;border:1px solid #e2e8f0;border-radius:999px;align-items:center;gap:6px;min-height:28px;padding:0 10px;font-size:12px;font-weight:800;display:inline-flex}.status-chip span{background:#cbd5e1;border-radius:999px;width:7px;height:7px}.status-chip.active{color:#0f766e;background:#ecfdf5;border-color:#99f6e4}.status-chip.active span{background:#14b8a6}.parser-note{color:#475569;align-items:flex-start;gap:8px;margin-top:12px;font-size:12px;line-height:1.45;display:flex}.parser-note svg{flex:none;margin-top:1px}.cloud-status{color:#475569;gap:4px;margin-top:10px;font-size:12px;line-height:1.45;display:grid}.wechat-helper{gap:10px;display:grid}.wechat-helper-row{flex-wrap:wrap;gap:8px;display:flex}.wechat-helper>button{color:#fff;background:#0f766e;border-color:#0f766e;width:100%}.wechat-helper-note,.wechat-latest{color:#475569;word-break:break-all;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:9px 10px;font-size:12px;line-height:1.45}.wechat-latest{gap:4px;display:grid}.wechat-latest span{color:#0f766e;font-weight:800}.wechat-latest strong{color:#111827;font-size:13px}.segmented{background:#edf2f7;border:1px solid #d8e0ea;border-radius:8px;grid-template-columns:repeat(4,1fr);margin-bottom:12px;padding:4px;display:grid}.mini-segmented{background:#f8fafc;border:1px solid #d8e0ea;border-radius:8px;grid-template-columns:1fr 1fr;margin:0 0 12px;padding:4px;display:grid}.preset-shortcuts{grid-template-columns:1fr 1fr;gap:8px;margin:0 0 12px;display:grid}.preset-shortcuts button{background:#f8fafc;justify-content:flex-start;min-height:36px;padding:0 10px}.segmented button{background:0 0;border:0;min-height:36px;padding:0 8px}.mini-segmented button{background:0 0;border:0;min-height:34px;padding:0 8px}.segmented .active,.mini-segmented .active{color:#0f766e;background:#fff;box-shadow:0 5px 16px #0f766e29}.range-label{color:#475569;gap:7px;margin-top:14px;font-size:13px;font-weight:700;display:grid}.range-label input{accent-color:#0f766e;width:100%}.primary-action{color:#fff;background:#0b6f64;border-color:#0b6f64;width:100%;min-height:52px;font-size:16px}.primary-action:hover{background:#095d55;border-color:#095d55}.progress-track{background:#e2e8f0;border-radius:999px;height:8px;margin:14px 0 10px;overflow:hidden}.progress-track span{background:#0f766e;height:100%;transition:width .25s;display:block}.status-text{color:#475569;min-height:40px;font-size:13px;line-height:1.5}.export-row button{background:#f8fafc}.preview-panel{min-width:0;overflow:hidden}.preview-header{background:#fff;border-bottom:1px solid #dfe9e5;justify-content:space-between;align-items:center;gap:12px;padding:18px;display:flex}.preview-header h2{overflow-wrap:anywhere;margin-bottom:5px}.preview-header p{color:#64748b;margin:0;font-size:13px}.stage{background:#eef4f1;justify-content:center;align-items:center;min-height:430px;display:flex;position:relative;overflow:hidden}.media-frame{max-width:100%;max-height:68vh;line-height:0;display:inline-block;position:relative}.media-frame canvas,.media-frame video{max-width:100%;max-height:68vh;display:block}.media-frame video{background:#0f172a;width:100%}.video-frame{width:100%}.empty-stage{background:#eef4f1}.empty-content{color:#5c6f68;text-align:center;max-width:370px;padding:42px 20px}.empty-content h2{color:#111827;margin:14px 0 8px;font-size:21px}.empty-content p{margin:0}.mask-box{color:#fff;cursor:grab;touch-action:none;background:#14b8a629;border:2px solid #0f766e;justify-content:center;align-items:center;display:flex;position:absolute;box-shadow:0 0 0 9999px #0f172a2e}.mask-box:active{cursor:grabbing}.mask-box span{white-space:nowrap;background:#0f172ac2;border-radius:6px;padding:4px 7px;font-size:12px;font-weight:800}.resize-handle{background:#fff;border:2px solid #0f766e;border-radius:999px;width:13px;height:13px;min-height:0;padding:0;position:absolute}.resize-handle:hover{transform:none}.resize-handle.nw{cursor:nwse-resize;top:-7px;left:-7px}.resize-handle.ne{cursor:nesw-resize;top:-7px;right:-7px}.resize-handle.sw{cursor:nesw-resize;bottom:-7px;left:-7px}.resize-handle.se{cursor:nwse-resize;bottom:-7px;right:-7px}.result-grid{grid-template-columns:1fr;gap:14px;padding:18px;display:grid}.result-box{background:#fff;border:1px solid #d9e6e1;border-radius:8px;min-height:170px;padding:14px}.result-title-row{justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;display:flex}.result-title-row h3{margin:0}.result-title-row button{color:#fff;background:#0f766e;border-color:#0f766e;flex:none;min-height:34px;padding:0 10px}.result-box img,.result-box video{object-fit:contain;max-width:100%;max-height:340px;display:block}.result-box p{color:#64748b;margin:0;font-size:14px}.history-list{gap:10px;margin:0;padding:0;list-style:none;display:grid}.history-list li{background:#f8fafc;border:1px solid #e2e8f0;border-radius:7px;gap:4px;padding:10px;display:grid}.history-list span{color:#111827;overflow-wrap:anywhere;font-size:14px;font-weight:750}.history-list small{color:#64748b}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=980px){.app-shell{padding:14px}.topbar{flex-direction:column;align-items:flex-start}.hero-cover{min-height:190px;padding:20px}.hero-cover:after{background:linear-gradient(90deg,#111c18 0%,#111c18f0 58%,#111c1873 100%)}.hero-visual{opacity:.66;width:74%}.topbar h1{font-size:26px}.workspace,.result-grid{grid-template-columns:1fr}.stage{min-height:310px}}@media (width<=560px){.app-shell{padding:10px}.hero-cover{min-height:210px}.hero-cover:after{background:linear-gradient(#111c18 0%,#111c18f0 58%,#111c185c 100%)}.hero-visual{opacity:.72;width:100%;height:48%;top:auto;bottom:0}.import-grid,.tool-row,.export-row,.preset-shortcuts,.size-presets,.segmented,.mini-segmented{grid-template-columns:1fr}.preview-header{flex-direction:column;align-items:flex-start}}