.toolbar{display:flex;align-items:center;height:48px;padding:0 16px 0 20px;background:var(--c2w-ide-bg);gap:6px;flex-shrink:0}.toolbar__logo{font-family:LXGW WenKai,sans-serif;font-weight:700;font-size:15px;color:var(--c2w-ide-text);letter-spacing:-.01em;-webkit-user-select:none;user-select:none}.toolbar__spacer{flex:1}.toolbar__icon{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:none;border-radius:50%;background:transparent;color:var(--c2w-ide-text-muted);cursor:pointer;transition:background .2s,color .2s}.toolbar__icon:hover{background:var(--c2w-ide-btn);color:var(--c2w-ide-text)}.toolbar__icon:active{transform:scale(.9)}.toolbar__icon--active{background:var(--c2w-ide-btn);color:var(--c2w-ide-text)}.toolbar__menu-anchor{position:relative}.toolbar__dropdown{position:absolute;top:calc(100% + 6px);right:0;width:210px;background:var(--c2w-ide-surface);border:1px solid rgba(128,128,128,.1);border-radius:14px;box-shadow:0 8px 32px #0000001f;padding:8px;z-index:2000}.toolbar__dropdown-label{font-family:LXGW WenKai,sans-serif;font-size:11px;font-weight:600;color:var(--c2w-ide-text-muted);padding:6px 10px 4px}.toolbar__dropdown-row{display:flex;gap:6px;padding:2px 10px 6px}.toolbar__chip{flex:1;height:30px;border:none;border-radius:8px;background:var(--c2w-ide-btn);color:var(--c2w-ide-text-muted);font-family:LXGW WenKai,sans-serif;font-size:12px;font-weight:500;cursor:pointer;transition:background .15s,color .15s,transform .12s}.toolbar__chip:hover{color:var(--c2w-ide-text)}.toolbar__chip:active{transform:scale(.95)}.toolbar__chip--active{background:#5e81ac;color:#fff}.toolbar__chip--active:hover{background:#4c6f9a;color:#fff}.toolbar__dropdown-divider{height:1px;background:var(--c2w-ide-btn);margin:4px 10px}.toolbar__dropdown-item{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;border-radius:8px;font-family:LXGW WenKai,sans-serif;font-size:13px;color:var(--c2w-ide-text);cursor:pointer;transition:background .15s}.toolbar__dropdown-item:hover{background:var(--c2w-ide-btn)}.toolbar__toggle{display:inline-flex;align-items:center;width:44px;height:26px;border-radius:13px;background:var(--c2w-ide-btn);padding:2px;transition:background .25s ease;cursor:pointer}.toolbar__toggle--on{background:#5e81ac}.toolbar__toggle-thumb{width:22px;height:22px;border-radius:50%;background:#fff;transition:transform .25s cubic-bezier(.4,0,.2,1);box-shadow:0 1px 4px #00000026}.toolbar__toggle--on .toolbar__toggle-thumb{transform:translate(18px)}.toolbar__dropdown-fonts{padding:2px 10px 6px;display:flex;flex-direction:column;gap:4px}.toolbar__font-item{display:flex;align-items:center;justify-content:space-between;padding:6px 8px;border-radius:8px;cursor:pointer;transition:background .15s}.toolbar__font-item:hover{background:var(--c2w-ide-btn)}.toolbar__font-item--active{background:#5e81ac;color:#fff}.toolbar__font-item--active:hover{background:#4c6f9a}.toolbar__font-name{font-family:LXGW WenKai,sans-serif;font-size:12px;font-weight:600}.toolbar__font-desc{font-family:LXGW WenKai,sans-serif;font-size:10px;opacity:.6}.toolbar__font-item--active .toolbar__font-desc{opacity:.8}.preview-panel{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--c2w-ide-preview-bg, #e4e6ec);transition:background .3s;padding:24px}.preview-panel__slide{width:100%;max-height:100%;aspect-ratio:16 / 9;border-radius:6px;overflow:hidden;box-shadow:0 2px 16px #00000012;position:relative}.preview-panel__iframe{width:1280px;height:720px;border:none;display:block;transform-origin:top left;background:var(--c2w-ide-surface, #ECEFF4)}.workspace-panel{height:100%;display:flex;flex-direction:column;color:var(--c2w-ide-text)}.workspace-panel__header{padding:24px 32px 16px;display:flex;flex-direction:column;align-items:center;gap:12px}.workspace-panel__title{font-size:15px;font-weight:700;letter-spacing:.03em;font-family:LXGW WenKai,sans-serif}.workspace-panel__actions{display:flex;gap:8px}.workspace-panel__btn{border:none;border-radius:999px;background:var(--c2w-ide-btn);color:var(--c2w-ide-text);padding:8px 18px;font-size:13px;font-family:LXGW WenKai,sans-serif;cursor:pointer;transition:background .2s,transform .15s,box-shadow .2s;box-shadow:0 1px 4px #00000014}.workspace-panel__btn:hover{box-shadow:0 2px 8px #0000001f}.workspace-panel__btn:active{transform:scale(.96)}.workspace-panel__btn--accent{background:#5e81ac;color:#fff}.workspace-panel__btn--accent:hover{background:#5278a0}.workspace-panel__hint{font-size:11px;color:var(--c2w-ide-text-muted);font-family:LXGW WenKai,sans-serif}.workspace-panel__content{flex:1;min-height:0;overflow:auto;padding:0 32px 32px}.workspace-panel__empty{text-align:center;color:var(--c2w-ide-text-muted);font-size:13px;padding-top:56px;font-family:LXGW WenKai,sans-serif}.workspace-panel__tree-list{list-style:none;margin:0;padding:0}.workspace-panel__tree-root{max-width:420px;margin:0 auto}.workspace-panel__tree-list .workspace-panel__tree-list{padding-left:20px}.workspace-panel__tree-item{position:relative;padding:2px 0}.workspace-panel__tree-list:not(.workspace-panel__tree-root)>.workspace-panel__tree-item:before{content:"";position:absolute;left:-10px;top:0;bottom:0;width:1px;background:#5e81ac33}.workspace-panel__tree-list:not(.workspace-panel__tree-root)>.workspace-panel__tree-item:after{content:"";position:absolute;left:-10px;top:20px;width:10px;height:1px;background:#5e81ac33}.workspace-panel__tree-list:not(.workspace-panel__tree-root)>.workspace-panel__tree-item:last-child:before{bottom:calc(100% - 20px)}.workspace-panel__node{display:flex;align-items:center;gap:10px;width:100%;border:none;background:transparent;color:var(--c2w-ide-text);font-size:13.5px;font-family:LXGW WenKai,sans-serif;padding:9px 12px;border-radius:10px;cursor:pointer;transition:background .2s,transform .12s;text-align:left}.workspace-panel__node:hover{background:#808ca01f}.workspace-panel__node:active{transform:scale(.98)}.workspace-panel__node--selected{background:#5e81ac2e}.workspace-panel__node--selected:hover{background:#5e81ac42}.workspace-panel__node--active{background:#5e81ac38;font-weight:600}.workspace-panel__node--active:hover{background:#5e81ac4d}.workspace-panel__icon{flex-shrink:0;opacity:.6}.workspace-panel__node--selected .workspace-panel__icon,.workspace-panel__node--active .workspace-panel__icon{opacity:.9}.workspace-panel__node-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:320px}@media(max-width:640px){.workspace-panel__header{padding:16px 16px 12px}.workspace-panel__content{padding:0 16px 24px}.workspace-panel__tree-root{max-width:100%}.workspace-panel__node-label{max-width:200px}}.workspace-panel__rename-input{flex:1;min-width:0;border:1px solid rgba(94,129,172,.5);border-radius:6px;background:var(--c2w-ide-surface, #f5f6f9);color:var(--c2w-ide-text, #2e3440);font-size:13.5px;font-family:LXGW WenKai,sans-serif;padding:3px 8px;outline:none;transition:border-color .15s}.workspace-panel__rename-input:focus{border-color:#5e81ac;box-shadow:0 0 0 2px #5e81ac33}.workspace-panel__ctx{position:fixed;z-index:3000;min-width:120px;background:var(--c2w-ide-surface, #f5f6f9);border:1px solid rgba(128,128,128,.12);border-radius:10px;box-shadow:0 6px 24px #00000024;padding:4px;display:flex;flex-direction:column;animation:ctx-pop .16s cubic-bezier(.2,.6,.35,1);transform-origin:top left}@keyframes ctx-pop{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}.workspace-panel__ctx-item{border:none;background:transparent;color:var(--c2w-ide-text, #2e3440);font-size:13px;font-family:LXGW WenKai,sans-serif;padding:8px 14px;border-radius:7px;cursor:pointer;text-align:left;transition:background .15s}.workspace-panel__ctx-item:hover{background:#5e81ac1f}.workspace-panel__ctx-item--danger{color:#bf616a}.workspace-panel__ctx-item--danger:hover{background:#bf616a1a}.workspace-panel__ctx-divider{height:1px;background:var(--c2w-ide-btn, #e0e3ea);margin:3px 8px}.workspace-panel__tree-item--dragging{opacity:.35}.workspace-panel__node--drop-target{background:#5e81ac2e!important;outline:2px dashed rgba(94,129,172,.5);outline-offset:-2px}.workspace-panel__btn--drop{background:#5e81ac4d!important;outline:2px dashed rgba(94,129,172,.5);outline-offset:-2px}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}.app{--c2w-ide-bg: #eceef3;--c2w-ide-surface: #f5f6f9;--c2w-ide-btn: #e0e3ea;--c2w-ide-text: #2e3440;--c2w-ide-text-muted: #848d9e;--c2w-ide-preview-bg: #e4e6ec;--c2w-ide-divider: #b8bec9;--c2w-ide-scrollbar: #c5cad3;--c2w-ide-glass-mask: rgba(226, 233, 245, .34)}.app--night{--c2w-ide-bg: #2e3440;--c2w-ide-surface: #3b4252;--c2w-ide-btn: #434c5e;--c2w-ide-text: #d8dee9;--c2w-ide-text-muted: #7b88a1;--c2w-ide-preview-bg: #272c36;--c2w-ide-divider: #4c566a;--c2w-ide-scrollbar: #4c566a;--c2w-ide-glass-mask: rgba(16, 20, 28, .3)}html,body,#root{height:100%;overflow:hidden;font-family:LXGW WenKai,sans-serif}body{background:#eceef3;color:#2e3440}::-webkit-scrollbar{width:7px;height:7px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--c2w-ide-scrollbar, #c5cad3);border-radius:999px}::-webkit-scrollbar-thumb:hover{background:var(--c2w-ide-text-muted, #adb4bf)}.app{display:flex;flex-direction:column;height:100vh;background:var(--c2w-ide-bg);color:var(--c2w-ide-text);transition:background .3s,color .3s}.app__main{display:flex;flex:1;overflow:hidden}.app__editor{min-width:200px;overflow:hidden;display:flex;flex-direction:column}.app__code{flex:1;min-width:0;min-height:0;overflow:hidden}.app__panel-loading{height:100%;display:grid;place-items:center;color:var(--c2w-ide-text-muted);font-size:13px;background:var(--c2w-ide-bg)}.app__drawer-loading{position:fixed;right:0;top:48px;width:min(420px,92vw);height:calc(100vh - 48px);display:grid;place-items:center;color:var(--c2w-ide-text-muted);background:var(--c2w-ide-surface);border-left:1px solid var(--c2w-ide-divider);z-index:2100}.app__preview{flex:1;min-width:200px;overflow:hidden;background:var(--c2w-ide-preview-bg);transition:background .3s}.app__divider{width:8px;cursor:col-resize;background:transparent;flex-shrink:0;position:relative}.app__divider:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:4px;height:36px;border-radius:999px;background:var(--c2w-ide-divider);transition:background .2s,height .2s}.app__divider:hover:after,.app__divider--dragging:after{background:#5e81ac;height:48px}.app__statusbar{display:flex;align-items:center;height:28px;padding:0 20px;background:var(--c2w-ide-bg);font-size:11px;color:var(--c2w-ide-text-muted);gap:24px;flex-shrink:0;font-family:LXGW WenKai,sans-serif;transition:background .3s,color .3s}.app__workspace-overlay{position:fixed;inset:0;z-index:2400;background:var(--c2w-ide-glass-mask);backdrop-filter:blur(18px) saturate(108%);-webkit-backdrop-filter:blur(18px) saturate(108%);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .28s ease,visibility 0s linear .28s}.app__workspace-overlay--open{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .28s ease,visibility 0s linear 0s}.app__workspace-layer{position:absolute;inset:52px 0 28px;overflow:hidden;transform:translateY(18px);opacity:0;transition:transform .3s cubic-bezier(.2,.6,.35,1),opacity .26s ease}.app__workspace-overlay--open .app__workspace-layer{transform:translateY(0);opacity:1}.app__workspace-close{position:fixed;top:10px;right:16px;z-index:2401;border:none;border-radius:999px;background:#0003;color:#f5f8ff;font-size:13px;font-family:LXGW WenKai,sans-serif;font-weight:500;padding:8px 18px;cursor:pointer;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);opacity:0;transform:translateY(-6px);transition:background .2s,opacity .22s ease .06s,transform .22s ease .06s}.app__workspace-overlay--open .app__workspace-close{opacity:1;transform:translateY(0)}.app__workspace-close:hover{background:#00000052}.app__workspace-close:active{transform:scale(.95)}@media(max-width:820px){.app__workspace-layer{inset:56px 0 28px}.app__workspace-close{top:12px;right:12px}}