.home-container[data-v-c9bb554d]{background:var(--color-canvas);width:100vw;height:100dvh;font-family:var(--font-body);color:var(--color-ink);box-sizing:border-box;flex-direction:column;display:flex;overflow:hidden}@keyframes pageEnter-c9bb554d{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.animate-scale-in[data-v-c9bb554d]{animation:pageEnter-c9bb554d var(--duration-slow) var(--ease-out) both}.home-main[data-v-c9bb554d]{min-height:0;padding:var(--space-8) var(--space-10) var(--space-10) var(--space-10);flex-direction:column;flex:1;display:flex;overflow-y:auto}.welcome-section[data-v-c9bb554d]{text-align:center;max-width:540px;padding:var(--space-12) var(--space-10);border-radius:var(--radius-xl);margin:80px auto}.welcome-graphic[data-v-c9bb554d]{margin-bottom:var(--space-6);font-size:56px;line-height:1}.welcome-section h2[data-v-c9bb554d]{font-family:var(--font-display);font-size:var(--text-2xl);margin-bottom:var(--space-3);color:var(--color-ink);font-weight:800;line-height:var(--leading-snug)}.welcome-section p[data-v-c9bb554d]{font-family:var(--font-body);font-size:var(--text-base);color:var(--color-ink-70);margin-bottom:var(--space-8);line-height:var(--leading-relaxed)}.dashboard-section[data-v-c9bb554d]{gap:var(--space-6);flex-direction:column;height:100%;display:flex}.dashboard-header[data-v-c9bb554d]{justify-content:space-between;align-items:center;display:flex}.section-title[data-v-c9bb554d]{font-family:var(--font-display);font-size:var(--text-xl);color:var(--color-ink);letter-spacing:-.01em;font-weight:700}.loading-state[data-v-c9bb554d],.empty-state[data-v-c9bb554d]{padding:var(--space-16);text-align:center;border-radius:var(--radius-lg);background:var(--color-fog);border:1px solid var(--color-grid);flex-direction:column;justify-content:center;align-items:center;min-height:280px;display:flex}.spinner[data-v-c9bb554d]{margin-bottom:var(--space-4);font-size:36px;animation:1.5s linear infinite rotate-c9bb554d;display:block}@keyframes rotate-c9bb554d{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.empty-emoji[data-v-c9bb554d]{margin-bottom:var(--space-4);font-size:48px;display:block}.empty-state h3[data-v-c9bb554d]{font-family:var(--font-display);font-size:var(--text-lg);margin-bottom:var(--space-2);color:var(--color-ink);font-weight:700}.empty-state p[data-v-c9bb554d]{font-size:var(--text-sm);color:var(--color-ink-50);line-height:var(--leading-relaxed)}.create-link[data-v-c9bb554d]{color:var(--color-rose);cursor:pointer;text-underline-offset:3px;transition:opacity var(--duration-fast) var(--ease-out);font-weight:600;text-decoration:underline}.create-link[data-v-c9bb554d]:hover{opacity:.8}.canvas-grid[data-v-c9bb554d]{gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(260px,1fr));display:grid}.canvas-card[data-v-c9bb554d]{cursor:pointer;background:var(--color-fog);border:1px solid var(--color-grid);border-radius:var(--radius-lg);padding:var(--space-5);box-sizing:border-box;transition:background var(--duration-base) var(--ease-out), box-shadow var(--duration-base) var(--ease-out), border-color var(--duration-base) var(--ease-out), transform var(--duration-base) var(--ease-out);flex-direction:column;justify-content:space-between;display:flex;overflow:hidden}.canvas-card[data-v-c9bb554d]:hover{background:var(--color-canvas);box-shadow:var(--shadow-md);border-color:var(--color-mist);transform:translateY(-2px)}.canvas-thumbnail-wrapper[data-v-c9bb554d]{background:var(--color-canvas);border-radius:var(--radius-md);border:1px solid var(--color-grid);width:100%;height:150px;margin-bottom:var(--space-4);justify-content:center;align-items:center;display:flex;overflow:hidden}.card-body[data-v-c9bb554d]{flex:1}.card-info[data-v-c9bb554d]{gap:var(--space-2);flex-direction:column;display:flex}.canvas-name[data-v-c9bb554d]{font-family:var(--font-display);font-size:var(--text-lg);color:var(--color-ink);font-weight:700;line-height:var(--leading-normal);white-space:nowrap;text-overflow:ellipsis;margin:0;overflow:hidden}.canvas-meta[data-v-c9bb554d]{gap:var(--space-2);flex-wrap:wrap;display:flex}.meta-tag[data-v-c9bb554d]{font-family:var(--font-mono);font-size:var(--text-xs);padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);background:var(--color-canvas);border:1px solid var(--color-grid);color:var(--color-ink-50);letter-spacing:.02em;font-weight:500}.size-tag[data-v-c9bb554d]{color:var(--color-leaf);background:#4a9e6a0f;border-color:#4a9e6a40}.time-tag[data-v-c9bb554d]{color:var(--color-ink-40)}.owner-tag[data-v-c9bb554d]{color:var(--color-rose);background:#e8547a0f;border-color:#e8547a40}.collab-tag[data-v-c9bb554d]{color:var(--color-amber);background:#f5a6230f;border-color:#f5a62340}.author-tag[data-v-c9bb554d]{color:var(--color-ink-70);border-color:var(--color-grid);background:var(--color-fog)}@media (width<=768px),(pointer:coarse){.home-main[data-v-c9bb554d]{padding:var(--space-4) var(--space-4) var(--space-6) var(--space-4)}.welcome-section[data-v-c9bb554d]{margin:var(--space-10) auto;padding:var(--space-6) var(--space-5)}.canvas-grid[data-v-c9bb554d]{gap:var(--space-3);grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.canvas-card[data-v-c9bb554d]{min-height:130px}.dashboard-header[data-v-c9bb554d]{align-items:flex-start;gap:var(--space-3);flex-direction:column}}@media (width<=1023px){.home-container[data-v-c9bb554d]{padding-bottom:var(--bottombar-height)}}.pagination-wrapper[data-v-c9bb554d]{margin-top:var(--space-8);padding-bottom:var(--space-4);justify-content:center;display:flex}.floating-top-toolbar-container[data-v-8a183191]{z-index:150;transition:all .3s cubic-bezier(.4,0,.2,1);position:absolute;bottom:16px;right:16px}.opacity-slider-card[data-v-8a183191]{width:180px;padding:var(--space-3) var(--space-4);border:1px solid var(--color-grid);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);z-index:200;gap:var(--space-1);background:#fff;flex-direction:column;display:flex;position:absolute;bottom:48px;left:50%;transform:translate(-50%)}.slider-header[data-v-8a183191]{font-size:var(--text-xs);color:var(--color-ink-60);justify-content:space-between;font-weight:600;display:flex}.el-button-group[data-v-8a183191] .el-button{box-sizing:border-box!important;border-radius:0!important;justify-content:center!important;align-items:center!important;height:32px!important;padding:0 12px!important;display:inline-flex!important}.el-button-group[data-v-8a183191] .el-button:first-child{border-top-left-radius:var(--radius-md)!important;border-bottom-left-radius:var(--radius-md)!important}.el-button-group[data-v-8a183191] .el-button:last-child{border-top-right-radius:var(--radius-md)!important;border-bottom-right-radius:var(--radius-md)!important}@media (width<=768px),(pointer:coarse){.floating-top-toolbar-container[data-v-8a183191]{bottom:calc(var(--bottombar-height,80px) + 12px);position:fixed;right:12px}}.editor-layout[data-v-e50d1aa6]{background-color:#f7f9fc;flex-direction:column;width:100vw;height:100dvh;display:flex;overflow:hidden}.top-bar-comp[data-v-e50d1aa6]{z-index:10}.main-editor-area[data-v-e50d1aa6]{flex:1;width:100vw;height:calc(100dvh - 64px);display:flex;overflow:hidden}.left-panel-wrapper[data-v-e50d1aa6]{flex-shrink:0;width:260px;height:100%;transition:width .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.left-panel-wrapper.collapsed[data-v-e50d1aa6]{width:0}.left-panel-wrapper.collapsed .left-bar-panel[data-v-e50d1aa6]{pointer-events:none;opacity:0;transform:translate(-20px)}.left-bar-panel[data-v-e50d1aa6]{width:260px;height:100%;transition:opacity .3s,transform .3s}.canvas-viewport[data-v-e50d1aa6]{background-color:#0000;background-image:radial-gradient(circle,#e1bee71a 10%,#0000 10%),radial-gradient(circle,#e1bee71a 10%,#0000 10%);background-position:0 0,10px 10px;background-repeat:repeat,repeat;background-size:20px 20px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;flex:1;justify-content:center;align-items:center;height:100%;transition:height .3s;display:flex;position:relative;overflow:hidden}.collapse-trigger[data-v-e50d1aa6]{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;z-index:100;color:#909399;background:#fffffff2;border:1px solid #e1bee766;justify-content:center;align-items:center;width:20px;height:60px;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;position:absolute;top:50%;transform:translateY(-50%);box-shadow:0 2px 10px #00000014}.collapse-trigger.left[data-v-e50d1aa6]{border-left:none;border-top-right-radius:10px;border-bottom-right-radius:10px;right:-20px}.collapse-trigger[data-v-e50d1aa6]:hover{background:var(--color-primary);color:#fff;width:24px}.collapse-trigger.left[data-v-e50d1aa6]:hover{right:-24px}.trigger-icon[data-v-e50d1aa6]{font-size:.65rem;font-weight:700}.mobile-floating-controls[data-v-e50d1aa6]{pointer-events:none;z-index:500;justify-content:flex-end;padding:0 16px;display:flex;position:fixed;bottom:88px;left:0;right:0}.floating-trigger-btn[data-v-e50d1aa6]{pointer-events:auto;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;background:#fffffff2;border:1px solid #e1bee766;border-radius:50%;justify-content:center;align-items:center;width:46px;height:46px;font-size:1.25rem;animation:.3s cubic-bezier(.175,.885,.32,1.275) popIn-e50d1aa6;display:flex;box-shadow:0 4px 16px #00000026}@keyframes popIn-e50d1aa6{0%{opacity:0;transform:scale(0)rotate(-45deg)}to{opacity:1;transform:scale(1)rotate(0)}}@media (width<=768px),(pointer:coarse){.collapse-trigger[data-v-e50d1aa6]{display:none!important}.left-panel-wrapper[data-v-e50d1aa6]{display:none}.main-editor-area[data-v-e50d1aa6]{flex-direction:column;height:calc(100dvh - 132px);overflow:hidden}.canvas-viewport[data-v-e50d1aa6]{flex:1;width:100%;height:100%}}.login-enforcer-overlay[data-v-e50d1aa6]{z-index:1000;-webkit-backdrop-filter:blur(20px);background:#fff0f566;justify-content:center;align-items:center;animation:.3s ease-out fadeIn-e50d1aa6;display:flex;position:fixed;inset:0}.enforcer-card[data-v-e50d1aa6]{text-align:center;background:#ffffffd9;border:1px solid #f8bbd080;border-radius:20px;width:90%;max-width:400px;padding:32px 24px;animation:.3s cubic-bezier(.175,.885,.32,1.275) scaleIn-e50d1aa6;box-shadow:0 12px 40px #f8bbd040}.enforcer-card h2[data-v-e50d1aa6]{color:#2c3e50;margin-bottom:12px;font-size:1.4rem;font-weight:700}.enforcer-card p[data-v-e50d1aa6]{color:#606266;margin-bottom:24px;font-size:.95rem;line-height:1.5}@keyframes fadeIn-e50d1aa6{0%{opacity:0}to{opacity:1}}@keyframes scaleIn-e50d1aa6{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.friends-canvas-floating-panel[data-v-e50d1aa6]{z-index:100;-webkit-backdrop-filter:blur(12px);background:#ffffffd9;border:1px solid #e1bee766;border-radius:12px;flex-direction:column;max-width:calc(100% - 32px);transition:all .3s cubic-bezier(.25,.8,.25,1);display:flex;position:absolute;top:16px;left:16px;overflow:hidden;box-shadow:0 4px 16px #00000014}.panel-header[data-v-e50d1aa6]{-webkit-user-select:none;user-select:none;color:#303133;background:#f8bbd026;border-bottom:1px solid #e1bee726;align-items:center;padding:6px 10px;font-size:10px;font-weight:700;display:flex}.panel-title[data-v-e50d1aa6]{white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.panel-body[data-v-e50d1aa6]{scrollbar-width:thin;flex-direction:row;gap:8px;max-width:100%;padding:6px;display:flex;overflow:auto hidden}.panel-body[data-v-e50d1aa6]::-webkit-scrollbar{height:4px}.panel-body[data-v-e50d1aa6]::-webkit-scrollbar-thumb{background:#e1bee766;border-radius:2px}.active-friend-card[data-v-e50d1aa6]{background:#ffffff80;border:1px solid #ffffff4d;border-radius:8px;flex-direction:column;flex-shrink:0;gap:4px;width:90px;padding:6px;display:flex}.friend-info[data-v-e50d1aa6]{flex-direction:column;gap:1px;display:flex}.active-friend-card .friend-name[data-v-e50d1aa6]{color:#303133;white-space:nowrap;text-overflow:ellipsis;font-size:10px;font-weight:600;overflow:hidden}.active-friend-card .canvas-name[data-v-e50d1aa6]{color:#909399;white-space:nowrap;text-overflow:ellipsis;font-size:9px;overflow:hidden}.thumbnail-wrapper[data-v-e50d1aa6]{aspect-ratio:1;background:#f5f7fa;border:1px solid #0000000d;border-radius:6px;justify-content:center;align-items:center;width:100%;display:flex;overflow:hidden}.friend-thumbnail[data-v-e50d1aa6]{object-fit:contain;width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges}.empty-thumbnail[data-v-e50d1aa6]{color:#c0c4cc;font-size:9px}.friend-status-row[data-v-e50d1aa6]{justify-content:space-between;align-items:center;gap:4px;display:flex}.status-dot[data-v-e50d1aa6]{background-color:#c0c4cc;border-radius:50%;flex-shrink:0;width:6px;height:6px}.status-dot.online[data-v-e50d1aa6]{background-color:#67c23a;box-shadow:0 0 4px #67c23a}.floating-mask-controls[data-v-e50d1aa6]{z-index:99;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#fffffff2;border:1px solid #e1bee766;border-radius:12px;flex-direction:column;gap:10px;padding:8px;display:flex;position:absolute;top:16px;right:16px;box-shadow:0 4px 15px #00000014}.mask-control-btn[data-v-e50d1aa6]{color:#606266;cursor:pointer;background:0 0;border:none;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;width:44px;height:44px;font-family:inherit;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.mask-control-btn[data-v-e50d1aa6]:hover{color:var(--color-primary);background:#7c4dff14}.mask-control-btn.active[data-v-e50d1aa6]{background:var(--color-primary);color:#fff;box-shadow:0 2px 8px #7c4dff40}.mask-control-btn .btn-icon[data-v-e50d1aa6]{font-size:1.1rem}.mask-control-btn .btn-text[data-v-e50d1aa6]{margin-top:2px;font-size:.65rem;font-weight:600}.fade-enter-active[data-v-e50d1aa6],.fade-leave-active[data-v-e50d1aa6]{transition:opacity .2s}.fade-enter-from[data-v-e50d1aa6],.fade-leave-to[data-v-e50d1aa6]{opacity:0}.preview-image-wrapper[data-v-e50d1aa6]{border:1px dashed var(--color-grid);padding:var(--space-3);border-radius:var(--radius-lg);max-width:100%;max-height:min(280px,45vh);box-shadow:inset 0 2px 8px var(--color-ink-06);transition:background-color var(--duration-base) var(--ease-out);justify-content:center;align-items:center;display:flex;overflow:auto}.preview-image-wrapper.bg-black[data-v-e50d1aa6]{background-color:#1a1a1a;background-image:none}.preview-image-wrapper.bg-white[data-v-e50d1aa6]{background-color:#fff;background-image:none}.preview-image-wrapper.bg-checker[data-v-e50d1aa6]{background-color:var(--color-fog);background-image:linear-gradient(45deg, var(--color-grid) 25%, transparent 25%, transparent 75%, var(--color-grid) 75%), linear-gradient(45deg, var(--color-grid) 25%, var(--color-canvas) 25%, var(--color-canvas) 75%, var(--color-grid) 75%);background-position:0 0,10px 10px;background-size:20px 20px}.preview-image-wrapper img[data-v-e50d1aa6]{object-fit:contain;max-width:100%;max-height:min(240px,40vh);box-shadow:var(--shadow-md);border-radius:var(--radius-sm)}.editor-canvas-info[data-v-e50d1aa6]{z-index:100;-webkit-backdrop-filter:blur(10px);border-radius:var(--radius-full);box-sizing:border-box;background:#ffffffd9;border:1px solid #fff9;align-items:center;gap:8px;max-width:calc(100vw - 32px);padding:6px 16px;display:flex;position:absolute;top:16px;left:50%;transform:translate(-50%);box-shadow:0 4px 20px #0000000d}.canvas-name-container[data-v-e50d1aa6]{white-space:nowrap;scrollbar-width:none;-ms-overflow-style:none;max-width:180px;overflow-x:auto}.canvas-name-container[data-v-e50d1aa6]::-webkit-scrollbar{display:none}.canvas-name-container.clickable[data-v-e50d1aa6]{cursor:pointer}.canvas-name-container.clickable[data-v-e50d1aa6]:hover{opacity:.7}.canvas-name-text[data-v-e50d1aa6]{font-family:var(--font-display);color:var(--color-ink);font-size:14px;font-weight:700}.canvas-size-badge[data-v-e50d1aa6]{background:var(--color-rose-10);color:var(--color-rose);border-radius:var(--radius-sm);white-space:nowrap;padding:2px 8px;font-size:12px;font-weight:700}.canvas-size-badge.clickable[data-v-e50d1aa6]{cursor:pointer;transition:all .2s}.canvas-size-badge.clickable[data-v-e50d1aa6]:hover{background:var(--color-rose-20)}@media (width<=768px){.editor-canvas-info[data-v-e50d1aa6]{padding:4px 12px;top:12px}.canvas-name-container[data-v-e50d1aa6]{max-width:100px}.canvas-name-text[data-v-e50d1aa6]{font-size:13px}}