:root{--bg:#0b0f14;--surface:#121923;--surface-raised:#18212d;--control:#1c2633;--control-strong:#243142;--border:#2a3646;--border-soft:#202a37;--accent:#f2c94c;--accent-ink:#17130a;--text:#f2f0e8;--muted:#8c98a8;--quiet:#687588;--danger:#e58b8b;--radius-card:16px;--radius-control:10px;--shadow:0 18px 48px #00040a57;--spring-gentle:cubic-bezier(.22, 1.22, .36, 1);--z-header:1000;--z-popover:1100;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{background:var(--bg);min-height:100%;margin:0}body{min-width:320px;color:var(--text);font-family:var(--font-geist-sans,system-ui), "PingFang SC", "Microsoft YaHei", sans-serif;-webkit-font-smoothing:antialiased}button,input,select{color:inherit;font:inherit}button{cursor:pointer;border:0;padding:0}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button:disabled{cursor:not-allowed;opacity:.36}.app-icon{-webkit-mask:var(--icon-url) center / contain no-repeat;mask:var(--icon-url) center / contain no-repeat;-webkit-mask:var(--icon-url) center / contain no-repeat;background-color:currentColor;flex:none;display:inline-block}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}.app-shell{background:radial-gradient(circle at 85% -10%, #293d5238, transparent 32rem), var(--bg);min-height:100dvh}.topbar{min-height:calc(58px + env(safe-area-inset-top));padding:env(safe-area-inset-top) max(20px, env(safe-area-inset-right)) 0 max(20px, env(safe-area-inset-left));z-index:var(--z-header);-webkit-backdrop-filter:blur(14px);background:#0b0f14f0;border-bottom:1px solid #2a3646b8;align-items:center;gap:10px;display:flex;position:relative}.brand{letter-spacing:-.02em;align-items:center;gap:9px;min-width:0;font-size:19px;font-weight:760;display:flex}.brand-mark{object-fit:cover;border-radius:6px;flex:none;width:22px;height:22px;display:block}.topbar-actions{justify-content:flex-end;align-items:center;gap:8px;margin-left:auto;display:flex}.shortcut-help{position:relative}.shortcut-button{color:#c8d0da;background:var(--control);border:1px solid var(--border);border-radius:var(--radius-control);place-items:center;width:36px;height:36px;transition:color .16s,background-color .16s,border-color .16s;display:grid}.shortcut-button:hover,.shortcut-button.is-active{color:var(--accent);background:var(--control-strong);border-color:#4c5e73}.shortcut-popover{width:224px;z-index:var(--z-popover);box-shadow:var(--shadow);background:#121923;border:1px solid #354355;border-radius:12px;gap:2px;padding:10px;display:grid;position:absolute;top:calc(100% + 9px);right:0}.shortcut-popover>strong{color:var(--text);padding:3px 5px 7px;font-size:13px}.shortcut-popover>div{min-height:34px;color:var(--muted);justify-content:space-between;align-items:center;gap:12px;padding:0 5px;font-size:12px;display:flex}.shortcut-popover kbd{color:#e5e8ed;min-width:27px;height:23px;font:650 11px/1 var(--font-geist-mono), monospace;background:#202b39;border:1px solid #3b4a5d;border-bottom-color:#526176;border-radius:5px;justify-content:center;align-items:center;padding:0 6px;display:inline-flex}.key-group{gap:4px;display:inline-flex}.library-page{width:min(100%,760px);padding:28px max(18px, env(safe-area-inset-right)) calc(56px + env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left));margin:0 auto}.library-footer-actions{flex-wrap:nowrap;justify-content:center;align-items:flex-start;gap:8px;min-height:52px;margin:14px auto 0;display:flex}.feedback-contact{justify-content:center;align-items:center;min-height:40px;margin:0;display:flex;position:relative}.author-contact{min-height:36px;color:var(--quiet);white-space:nowrap;background:0 0;border-radius:8px;justify-content:center;align-items:center;gap:6px;padding:0 10px;font-size:12px;font-weight:650;transition:color .16s,background-color .16s;display:inline-flex}.author-contact:hover{color:#aeb8c5;background:#ffffff09}.author-contact:focus-visible{color:#aeb8c5;background:#ffffff09}.feedback-notice{z-index:11;color:var(--accent);text-align:center;white-space:nowrap;font-size:11px;line-height:1.4;position:absolute;top:calc(100% + 2px);left:50%;transform:translate(-50%)}.import-dropzone{width:100%;min-height:176px;color:var(--text);border-radius:var(--radius-card);transform-origin:50%;background:#0f151e;border:1px dashed #405169;flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:30px;font-size:18px;font-weight:720;transition:transform .28s cubic-bezier(.34,1.56,.64,1),background-color .12s,border-color .12s;display:flex}.import-dropzone:hover{border-color:var(--accent);background:#141d28}.import-mark{width:50px;height:50px;color:var(--accent-ink);background:var(--accent);border-radius:var(--radius-control);place-items:center;display:grid;box-shadow:0 12px 28px #f2c94c29}.inline-error{color:#ffd1d1;border-radius:var(--radius-control);background:#2b171d;border:1px solid #65323d;margin-top:14px;padding:12px 14px;font-size:14px;line-height:1.5}.section-heading{justify-content:space-between;align-items:baseline;margin:32px 4px 12px;display:flex}.section-heading h1{letter-spacing:-.02em;margin:0;font-size:20px}.section-heading span{color:var(--muted);font-size:13px}.file-list{background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius-card)}.file-row{background:var(--surface);grid-template-columns:minmax(0,1fr) 62px;min-height:106px;transition:background-color .12s;display:grid;position:relative}.file-row:first-child{border-radius:var(--radius-card) var(--radius-card) 0 0}.file-row:last-child{border-radius:0 0 var(--radius-card) var(--radius-card)}.file-row:only-child{border-radius:var(--radius-card)}.file-row+.file-row{border-top:1px solid var(--border-soft)}.file-row:hover,.file-row:focus-within,.file-row.is-menu-open{background:#ffffff06}.file-open{text-align:left;transform-origin:50%;background:0 0;grid-template-columns:84px minmax(0,1fr);align-items:center;gap:14px;min-width:0;padding:13px 4px 13px 12px;transition:transform .28s cubic-bezier(.34,1.56,.64,1),background-color .12s;display:grid}.file-cover{aspect-ratio:4/3;width:78px;color:var(--accent-ink);font:800 12px/1 var(--font-geist-mono), monospace;letter-spacing:.08em;background:linear-gradient(145deg,#ffffff2e,#0000 54%),#d9aa24;border:1px solid #ffffff14;border-radius:9px;align-self:center;align-items:flex-end;padding:9px;display:flex;transform:rotate(-2deg);box-shadow:0 9px 18px #00040a42}.file-cover.has-image{background:#1b2632;align-items:stretch;padding:0}.file-cover img{object-fit:cover;border-radius:inherit;width:100%;height:100%;display:block}.file-copy{min-width:0;color:var(--muted);flex-direction:column;align-items:flex-start;gap:4px;font-size:13px;display:flex}.file-copy small{color:var(--quiet);font-size:12px}.file-title-line{align-items:center;gap:8px;width:100%;display:flex}.file-title-line strong{min-width:0;color:var(--text);text-overflow:ellipsis;white-space:nowrap;font-size:15px;line-height:1.35;overflow:hidden}.file-badge{color:var(--accent);background:#252719;border-radius:5px;flex:none;padding:3px 6px;font-size:10px;font-weight:700}.file-action{opacity:0;pointer-events:none;justify-content:flex-end;align-items:center;padding-right:10px;transition:opacity .14s;display:flex}.file-row:hover .file-action,.file-row:focus-within .file-action,.file-row.is-menu-open .file-action{opacity:1;pointer-events:auto}.square-button,.icon-button,.transport-files button{color:#d8dde5;background:var(--control);border:1px solid var(--border);border-radius:var(--radius-control);place-items:center;width:42px;height:42px;transition:background-color .16s,color .16s,border-color .16s,transform .16s;display:grid}.square-button.is-active{color:var(--accent-ink);background:var(--accent);border-color:var(--accent)}.square-button.is-active .app-icon{transform:rotate(180deg)}.file-menu{z-index:8;border-radius:var(--radius-control);width:168px;box-shadow:var(--shadow);background:#1b2531;border:1px solid #344153;position:absolute;top:78px;right:10px;overflow:hidden}.file-menu button{color:#e5e8ed;transform-origin:50%;background:#1b2531;justify-content:flex-start;align-items:center;gap:9px;width:100%;min-height:44px;padding:0 14px;font-size:13px;transition:transform .28s cubic-bezier(.34,1.56,.64,1),background-color .12s,color .12s;display:flex}.file-menu button+button{border-top:1px solid var(--border)}.file-menu button:hover{background:var(--control-strong)}.file-menu .danger{color:var(--danger)}.mini-program-entry{z-index:10;justify-content:center;min-height:40px;margin:0;display:flex;position:relative}.mini-program-trigger{min-height:40px;color:var(--muted);white-space:nowrap;border-radius:var(--radius-control);background:0 0;justify-content:center;align-items:center;gap:6px;padding:0 12px;font-size:12px;font-weight:650;transition:color .14s,background-color .14s,transform .28s cubic-bezier(.34,1.56,.64,1);display:inline-flex}.mini-program-entry:hover .mini-program-trigger,.mini-program-entry:focus-within .mini-program-trigger,.mini-program-entry.is-open .mini-program-trigger{color:var(--accent);background:#ffffff09}.mini-program-popover{z-index:24;width:220px;color:var(--text);border-radius:var(--radius-card);opacity:0;visibility:hidden;pointer-events:none;transform-origin:50% 100%;background:#121923;border:1px solid #344153;justify-items:center;gap:5px;padding:14px;transition:opacity .16s,visibility 0s linear .16s,transform .22s cubic-bezier(.22,1,.36,1);display:grid;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%,8px)scale(.97);box-shadow:0 18px 44px #00040a7a}.mini-program-popover strong{font-size:15px;line-height:1.3}.mini-program-popover span{color:var(--muted);margin-bottom:7px;font-size:12px}.mini-program-popover img{object-fit:cover;background:#fff;border-radius:10px;width:188px;height:188px;display:block}.mini-program-entry:hover .mini-program-popover,.mini-program-entry:focus-within .mini-program-popover,.mini-program-entry.is-open .mini-program-popover{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s;transform:translate(-50%)scale(1)}.preview-shell{height:100dvh;overflow:hidden}.drawer-workspace.is-open{height:calc(100dvh - 54px - env(safe-area-inset-top));background:var(--bg);grid-template-columns:0 minmax(0,1fr);display:grid}.drawer-workspace.is-open .drawer-home-pane{opacity:0;visibility:hidden;pointer-events:none;border-right:1px solid #0000;width:100%;min-width:0;overflow:hidden;transform:translate(-12px)}.drawer-home-topbar,.drawer-close{display:none}.preview-topbar{min-height:calc(54px + env(safe-area-inset-top));grid-template-columns:72px 1fr 72px;display:grid}.preview-topbar .brand{text-align:center}.topbar-back,.topbar-download{min-height:40px;color:var(--text);background:0 0;align-items:center;display:flex}.topbar-back{justify-content:flex-start}.topbar-download{color:var(--accent);white-space:nowrap;justify-content:flex-end;gap:5px;font-size:13px;font-weight:680}.preview-page{height:calc(100dvh - 54px - env(safe-area-inset-top));width:min(100%,920px);padding:6px max(16px, env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));flex-direction:column;margin:0 auto;display:flex;overflow:hidden}.file-heading{flex:none;justify-content:space-between;align-items:center;gap:14px;min-height:70px;padding:7px 3px 10px;display:flex}.file-heading-copy{min-width:0}.file-heading h1{text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:19px;line-height:1.35;overflow:hidden}.file-heading-meta{color:var(--muted);white-space:nowrap;align-items:center;gap:9px;margin-top:5px;font-size:11px;display:flex;overflow:hidden}.timecode{color:var(--accent);font-family:var(--font-geist-mono), monospace;font-variant-numeric:tabular-nums}.file-fps{color:var(--accent);font:700 11px/1 var(--font-geist-mono), monospace;font-variant-numeric:tabular-nums;flex:none}.file-heading-download{width:42px;height:42px;color:var(--accent);background:var(--control);border:1px solid var(--border);border-radius:var(--radius-control);flex:none;place-items:center;display:none}.canvas-card{border:1px solid var(--border);border-radius:var(--radius-card);width:100%;min-height:250px;max-height:66dvh;box-shadow:var(--shadow);flex:none;transition:height .26s cubic-bezier(.22,1,.36,1),background-color .18s;position:relative;overflow:hidden}.canvas-card.is-proportional{align-self:center;height:auto;min-height:0}.canvas-card canvas{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;width:100%;height:100%;display:block}.tone-mist{background-color:#1b2632;background-image:linear-gradient(45deg,#ffffff09 25%,#0000 25%),linear-gradient(-45deg,#ffffff09 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#ffffff09 75%),linear-gradient(-45deg,#0000 75%,#ffffff09 75%);background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px}.tone-paper{background:#e8e4d9}.tone-white{background:#fff}.tone-yellow{background:var(--accent)}.tone-ink{background:#070a0e}.canvas-state{color:var(--muted);text-align:center;background:#151d27;flex-direction:column;justify-content:center;align-items:center;padding:24px;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}.loading-ring{width:74px;height:74px;color:var(--text);font:720 14px/1 var(--font-geist-mono), monospace;border:5px solid #263140;border-top-color:var(--accent);border-radius:50%;place-items:center;display:grid;position:relative}.loading-ring:after{content:"";border-radius:inherit;border:5px solid #0000;border-right-color:#f2c94c73;animation:.9s linear infinite loading-spin;position:absolute;top:-5px;bottom:-5px;left:-5px;right:-5px}.loading-state p,.error-state p{margin:13px 0 0;font-size:13px;line-height:1.5}.loading-track{background:#263140;border-radius:99px;width:min(220px,65%);height:4px;margin-top:13px;overflow:hidden}.loading-track i{background:var(--accent);height:100%;transition:width .16s;display:block}.error-state strong{color:var(--text);font-size:17px}.error-state button{color:var(--accent-ink);background:var(--accent);border-radius:var(--radius-control);margin-top:14px;padding:10px 14px;font-size:13px;font-weight:700}.stage-resizer{z-index:6;touch-action:none;-webkit-user-select:none;user-select:none;height:32px;transition:height .42s var(--spring-gentle);background:0 0;flex:none;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;display:grid;position:relative}.stage-resizer.is-selecting{height:48px}.stage-resizer-grip{z-index:2;background:var(--quiet);width:42px;height:5px;transition:width .42s var(--spring-gentle), height .36s var(--spring-gentle), background-color .16s ease;border-radius:99px;grid-column:2;justify-self:center;position:relative}.stage-resizer.is-selecting .stage-resizer-grip{width:calc(100% - 16px);height:3px}.stage-resizer.is-press-active .stage-resizer-grip,.stage-resizer.is-dragging .stage-resizer-grip{background:var(--accent)}.stage-resizer.is-tap-open .stage-resizer-grip{background:var(--quiet)}.stage-resizer-modes{pointer-events:none;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;display:grid;position:absolute;top:8px;bottom:8px;left:6px;right:6px}.stage-resizer-mode{min-width:0;color:var(--muted);border-radius:var(--radius-control);opacity:0;pointer-events:none;transition:color .12s ease, background-color .12s ease, transform .42s var(--spring-gentle), opacity .3s ease;background:0 0;justify-content:center;align-items:center;gap:6px;font-size:12px;font-weight:680;display:inline-flex}.stage-resizer-mode.mode-contain{grid-column:1;transform:translate(calc(100% + 8px))}.stage-resizer-mode.mode-cover{grid-column:3;transform:translate(calc(-100% - 8px))}.stage-resizer.is-selecting .stage-resizer-mode{opacity:1;pointer-events:auto;transform:translate(0)}.stage-resizer-mode.is-current{color:var(--accent)}.stage-resizer-mode:hover,.stage-resizer-mode.is-hovered{color:var(--accent);background:#f2c94c24}.transport{flex:none;grid-template-columns:repeat(5,minmax(0,1fr));align-items:center;gap:10px;min-height:48px;display:grid}.transport-playback,.transport-files{align-items:center;gap:10px;display:flex}.transport-playback{grid-column:1/span 2;grid-template-columns:repeat(2,minmax(0,1fr));min-width:0;display:grid}.transport-playback .icon-button{width:100%}.speed-select{grid-column:3;justify-content:center;width:100%;min-width:0}.transport-files{grid-column:4/span 2;grid-template-columns:repeat(2,minmax(0,1fr));min-width:0;display:grid}.transport-files button{width:100%}.transport-files{justify-content:flex-end}.speed-select{height:38px;color:var(--accent);background:var(--control);border:1px solid var(--border);border-radius:var(--radius-control);align-items:center;gap:5px;padding:0 8px 0 10px;display:flex}.speed-select select{min-width:50px;color:var(--text);font:700 12px/1 var(--font-geist-mono), monospace;background:0 0;border:0}.control-panel{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--border) transparent;flex:1;min-height:0;margin-top:8px;padding:4px 2px 16px;overflow-y:auto}.parameter-row{grid-template-columns:82px minmax(0,1fr);align-items:start;gap:8px;min-height:44px;padding:6px 2px;display:grid}.parameter-label{color:var(--muted);white-space:nowrap;padding-top:8px;font-size:12px;font-weight:620;line-height:1.2}.parameter-actions{flex-wrap:wrap;justify-content:flex-end;gap:7px;display:flex}.parameter-tag,.disclosure-tag,.number-tag{color:#d8dde5;text-align:center;background:var(--control);border:1px solid var(--border);border-radius:8px;justify-content:center;align-items:center;gap:6px;min-height:32px;padding:0 11px;font-size:12px;line-height:1.2;transition:background-color .16s,border-color .16s,color .16s,transform .16s;display:inline-flex;position:relative;overflow:hidden}.parameter-tag>span,.disclosure-tag>span{z-index:1;align-items:center;gap:5px;display:inline-flex;position:relative}.parameter-tag.is-selected{color:var(--accent-ink);background:var(--accent);border-color:var(--accent)}.parameter-tag.is-playing{color:#f2f0e8;background:var(--control);border-color:#735f26}.parameter-tag.timeline-tag{padding-left:25px;padding-right:25px}.timeline-progress{z-index:0;pointer-events:none;background:#f2c94c52;height:100%;transition:width .1s linear;position:absolute;top:0;bottom:0;left:0;right:auto}.disclosure-tag i{background:#f2c94c3d;height:100%;position:absolute;top:0;left:0}.number-tag{padding-right:6px}.number-tag input{width:62px;height:24px;color:var(--text);font:650 11px/1 var(--font-geist-mono), monospace;background:#111821;border:1px solid #354355;border-radius:5px;padding:0 6px}.empty-tag{min-height:32px;color:var(--quiet);align-items:center;padding:0 8px;font-size:12px;display:inline-flex}.tone-button{border:2px solid var(--border);border-radius:999px;flex:none;width:45px;height:30px;box-shadow:inset 0 0 0 2px #0b0f14b3}.tone-button.is-active{border-color:var(--accent)}.press-feedback,.press-feedback-large{transform-origin:50%;transition:transform .28s cubic-bezier(.34,1.56,.64,1),background-color .12s,border-color .12s,color .12s}.press-feedback:active:not(:disabled){z-index:20;transition-duration:70ms,.12s,.12s,.12s;position:relative;transform:scale(1.25)}.press-feedback-large:active:not(:disabled){z-index:5;transition-duration:70ms,.12s,.12s,.12s;position:relative;transform:scale(1.025)}@keyframes loading-spin{to{transform:rotate(360deg)}}@media (min-width:768px){.preview-page{padding-left:24px;padding-right:24px}.file-heading h1{font-size:22px}.parameter-row{grid-template-columns:110px minmax(0,1fr)}}@media (min-width:860px){.drawer-workspace{grid-template-columns:100% 0;width:min(100%,1440px);margin:0 auto;display:grid}.drawer-workspace .drawer-home-pane{min-width:0}.drawer-home-topbar{display:flex}.preview-topbar{display:none}.drawer-workspace.is-open{height:calc(100dvh - 58px - env(safe-area-inset-top));grid-template-columns:400px calc(100% - 400px)}.drawer-workspace.is-open .drawer-home-pane{opacity:1;visibility:visible;pointer-events:auto;border-right:1px solid var(--border-soft);overflow:hidden auto;transform:translate(0)}.drawer-workspace.is-open .library-page{width:100%;padding-left:18px;padding-right:18px}.drawer-workspace.is-open .file-row.is-current{box-shadow:inset 3px 0 var(--accent);background:#1a2230}.drawer-preview-panel{background:var(--bg);width:auto;min-width:0;height:100%;margin:0;padding-left:24px;padding-right:24px}.drawer-preview-panel .file-heading{justify-content:flex-start}.drawer-preview-panel .file-heading-copy{flex:1}.drawer-preview-panel .file-heading-download{display:grid}.drawer-close{width:40px;height:40px;color:var(--text);background:var(--control);border:1px solid var(--border);border-radius:var(--radius-control);flex:none;place-items:center;transition:color .16s,background-color .16s,border-color .16s;display:grid}.drawer-close:hover{color:var(--accent);background:var(--control-strong);border-color:#4c5e73}}@media (prefers-reduced-motion:no-preference){.drawer-workspace{transition:grid-template-columns .26s cubic-bezier(.16,1,.3,1)}.drawer-workspace.is-open .drawer-home-pane{transition:opacity .18s,transform .26s cubic-bezier(.16,1,.3,1),border-color .18s}.drawer-preview-panel{animation:.18s cubic-bezier(.16,1,.3,1) both drawer-panel-in}}@media (hover:none){.file-action{opacity:1;pointer-events:auto}}@media (prefers-reduced-motion:reduce){.press-feedback,.press-feedback-large,.stage-resizer,.stage-resizer-grip,.stage-resizer-mode{transition:none}}@keyframes drawer-panel-in{0%{opacity:0;transform:translate(12px)}to{opacity:1;transform:translate(0)}}@media (max-width:520px){.library-page{padding-top:22px}.file-row{grid-template-columns:minmax(0,1fr) 54px}.file-open{grid-template-columns:74px minmax(0,1fr);gap:10px}.file-cover{width:68px}.preview-page{padding-left:12px;padding-right:12px}.canvas-card{border-radius:12px}.parameter-row{grid-template-columns:76px minmax(0,1fr);gap:5px}.parameter-tag,.disclosure-tag,.number-tag{padding-left:9px;padding-right:9px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media (prefers-reduced-transparency:reduce){.topbar{background:var(--bg);-webkit-backdrop-filter:none}}