@robot-admin/layout 2.2.0 → 2.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +5 -2
- package/dist/index.cjs +9 -9
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +2 -1
- package/dist/index.d.ts +21 -3
- package/dist/index.js +1969 -2633
- package/dist/index.js.map +1 -1
- package/package.json +5 -5
- package/src/styles/settings.scss +5 -5
package/dist/index.css
CHANGED
|
@@ -1 +1,2 @@
|
|
|
1
|
-
@charset "UTF-8";.layout-container{--menu-border-radius: 10px;--menu-parent-gradient-start: rgba(99, 102, 241, .1);--menu-parent-gradient-end: rgba(139, 92, 246, .06);--menu-parent-border-color: rgba(99, 102, 241, .45);--menu-parent-border-width: 2px;--menu-parent-shadow: 0 2px 6px rgba(99, 102, 241, .1), 0 4px 12px rgba(99, 102, 241, .06);--menu-selected-gradient-start: rgba(99, 102, 241, .22);--menu-selected-gradient-end: rgba(139, 92, 246, .16);--menu-selected-border-color: rgba(99, 102, 241, .75);--menu-selected-border-width: 3px;--menu-selected-shadow: 0 2px 12px rgba(99, 102, 241, .22), 0 4px 24px rgba(99, 102, 241, .15);--menu-parent-blur: 14px;--menu-parent-saturate: 130%;--menu-selected-blur: 16px;--menu-selected-saturate: 135%}.layout-container{height:100vh;overflow:hidden;display:flex;flex-direction:column}.layout-container .content-with-header{margin-top:100px;height:calc(100vh - 150px)}.layout-container .app-content{background-color:var(--app-bg-content)}.layout-container .n-layout-content{display:flex;flex-direction:column;flex:1;overflow-x:hidden}.main-content{flex:1;padding:16px;overflow-y:auto;overflow-x:hidden;width:100%;border-radius:8px}[data-theme=light] .layout-container .light-theme,.layout-container .light-theme,[data-theme=dark] .layout-container .dark-theme,.layout-container .dark-theme{background-color:var(--app-bg-body)}.layout-container.light-mode .n-layout .n-layout-scroll-container{background-color:var(--app-bg-surface);border-radius:10px}.layout-container.dark-mode .n-layout .n-layout-scroll-container,.layout-container.system-mode .n-layout .n-layout-scroll-container{background-color:var(--app-bg-surface)}.layout-sider{transform:translateZ(0);backface-visibility:hidden;contain:layout style paint}.layout-sider.light-theme,.layout-sider.dark-theme{background-color:var(--app-menu-bg)}.layout-sider .n-scrollbar-rail{width:0!important}.layout-sider .n-scrollbar-content{padding-right:0!important}.layout-container .n-layout-sider{flex-shrink:0;height:100%;display:flex;flex-direction:column;overflow:hidden}.menu-scroll-container{height:calc(100vh - 56px);overflow-y:scroll;scrollbar-width:none;-ms-overflow-style:none;flex:1;display:flex;flex-direction:column}.menu-scroll-container::-webkit-scrollbar{display:none}.layout-container .n-menu.n-menu--vertical{flex:1;min-height:min-content;overflow-y:auto;overflow-x:hidden}.layout-container .n-menu-item-content__icon{display:flex;align-items:center;justify-content:center;vertical-align:middle;width:18px!important;height:18px!important;margin-right:10px;transition:all .3s cubic-bezier(.4,0,.2,1);font-size:18px!important}.layout-container .n-menu-item-content__icon .n-icon{width:18px!important;height:18px!important;font-size:18px!important}.layout-container .n-menu-item-content__icon svg{width:18px!important;height:18px!important}.layout-container .n-menu-item-content-header{font-size:14px;font-weight:500;letter-spacing:.2px;line-height:1.5}.layout-container .n-menu-item-content__arrow{font-size:14px;transition:all .3s cubic-bezier(.4,0,.2,1)}.layout-container .n-menu-item{border-radius:0;position:relative;overflow:visible;transition:all .3s cubic-bezier(.4,0,.2,1);will-change:transform}.layout-container .n-menu-item:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#ffffff14,#ffffff0a);border-radius:10px;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:-1;box-shadow:0 2px 4px #00000014,inset 0 1px #ffffff1a}.layout-container .n-menu-item-content{border-radius:var(--menu-border-radius, 10px);background:transparent;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;padding:10px 16px}.layout-container .n-menu-item-content:after{content:"";position:absolute;inset:0;border:1px solid rgba(255,255,255,.06);border-left:2px solid transparent;border-radius:var(--menu-border-radius, 10px);pointer-events:none;transition:all .3s cubic-bezier(.4,0,.2,1)}.layout-container .n-menu-item:hover{transform:translate(2px)}.layout-container .n-menu-item:hover:before{background:#ffffff1a;border-radius:10px;box-shadow:0 4px 16px #0000001f,inset 0 1px #ffffff1f}.layout-container .n-menu-item:hover .n-menu-item-content{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:10px}.layout-container .n-menu-item:hover .n-menu-item-content:after{border-left-color:#6366f166;border-radius:10px;box-shadow:0 0 15px #6366f126,inset 0 1px 1px #ffffff1a}.layout-container .n-menu-item:hover .n-menu-item-content__icon{transform:scale(1.08);color:var(--n-item-icon-color-active-hover)}.layout-container .n-menu-item--selected,.layout-container .n-menu-item-content--selected{background:transparent!important}.layout-container .n-menu-item--selected:before,.layout-container .n-menu-item-content--selected:before{background:linear-gradient(135deg,var(--menu-selected-gradient-start, rgba(99, 102, 241, .22)) 0%,var(--menu-selected-gradient-end, rgba(139, 92, 246, .16)) 100%)!important;border-radius:var(--menu-border-radius, 10px);box-shadow:var(--menu-selected-shadow, 0 2px 12px rgba(99, 102, 241, .22), 0 4px 24px rgba(99, 102, 241, .15)),inset 0 1px 2px #6366f11f,inset 0 0 0 1px #ffffff14}.layout-container .n-menu-item--selected .n-menu-item-content,.layout-container .n-menu-item-content--selected{background:transparent!important;backdrop-filter:blur(var(--menu-selected-blur, 16px)) saturate(var(--menu-selected-saturate, 135%));-webkit-backdrop-filter:blur(var(--menu-selected-blur, 16px)) saturate(var(--menu-selected-saturate, 135%))}.layout-container .n-menu-item--selected .n-menu-item-content:after,.layout-container .n-menu-item-content--selected:after{border-left:var(--menu-selected-border-width, 3px) solid var(--menu-selected-border-color, rgba(99, 102, 241, .75));border-radius:var(--menu-border-radius, 10px);box-shadow:0 0 14px #6366f140,inset 0 1px 2px #ffffff1f}.layout-container .n-menu-item--selected .n-menu-item-content__icon{filter:drop-shadow(0 0 6px rgba(99,102,241,.5));transform:scale(1.05);color:var(--n-item-icon-color-active)}.layout-container .n-menu-item:active{transform:scale(.98)}.layout-container .n-menu-item-content--child-active{background:transparent!important}.layout-container .n-menu-item-content--child-active:before{background:linear-gradient(135deg,var(--menu-parent-gradient-start, rgba(99, 102, 241, .1)) 0%,var(--menu-parent-gradient-end, rgba(139, 92, 246, .06)) 100%)!important;border-radius:var(--menu-border-radius, 10px);box-shadow:var(--menu-parent-shadow, 0 2px 6px rgba(99, 102, 241, .1), 0 4px 12px rgba(99, 102, 241, .06)),inset 0 1px 2px #6366f10f,inset 0 0 0 1px #ffffff0d}.layout-container .n-menu-item-content--child-active:after{border-left:var(--menu-parent-border-width, 2px) solid var(--menu-parent-border-color, rgba(99, 102, 241, .45));border-radius:var(--menu-border-radius, 10px)}.layout-container .n-menu-item-content--child-active{backdrop-filter:blur(var(--menu-parent-blur, 14px)) saturate(var(--menu-parent-saturate, 130%));-webkit-backdrop-filter:blur(var(--menu-parent-blur, 14px)) saturate(var(--menu-parent-saturate, 130%))}.layout-container .n-menu>.n-menu-item,.layout-container .n-menu>.n-submenu{margin:4px 12px}.layout-container .n-submenu-children .n-menu-item{margin:4px 0}.layout-container .n-submenu-children .n-menu-item-content{padding-left:46px}.dark-theme{color-scheme:dark}.dark-theme .layout-container .n-menu-item:before{background:linear-gradient(135deg,#ffffff14,#ffffff0a);box-shadow:0 2px 4px #0000001f,inset 0 1px #ffffff14}.dark-theme .layout-container .n-menu-item:hover:before{background:linear-gradient(135deg,#ffffff1f,#ffffff14)}.light-theme{color-scheme:light}.light-theme .layout-container .n-menu-item:before{background:linear-gradient(135deg,#fff9,#fff6);box-shadow:0 2px 4px #0000000a,inset 0 1px #fffc}.light-theme .layout-container .n-menu-item:hover:before{background:linear-gradient(135deg,#fffc,#fff9)}.light-theme .layout-container .n-menu-item-content:after{border-color:#00000014}.layout-container .n-menu.n-menu--collapsed{width:64px!important;display:flex;flex-direction:column;align-items:center}.layout-container .n-menu.n-menu--collapsed .n-menu-item-content{justify-content:center!important;padding:0!important;display:flex;align-items:center;width:62px}.layout-container .n-menu.n-menu--collapsed .n-icon{margin-left:40px!important;margin-top:4px!important}.layout-container .n-menu.n-menu--collapsed .n-menu-item{padding:0!important;display:flex;justify-content:center;width:100%}.layout-container .n-menu.n-menu--collapsed .n-menu-item-content-header{margin:-10px auto 0;padding:0}.layout-container .n-menu.n-menu--collapsed .n-menu-item-content__icon{margin-right:0}.layout-container .n-menu.n-menu--collapsed .n-menu-item-content--child-active .n-menu-item-content__icon{color:var(--n-item-color-active)!important}.layout-container .n-menu.n-menu--collapsed .n-menu-item-content--child-active{background:transparent!important}.layout-container .n-menu.n-menu--collapsed .n-menu-item-content--child-active:before{background:linear-gradient(135deg,var(--menu-selected-gradient-start, rgba(99, 102, 241, .22)) 0%,var(--menu-selected-gradient-end, rgba(139, 92, 246, .16)) 100%)!important;border-radius:var(--menu-border-radius, 10px);box-shadow:var(--menu-selected-shadow, 0 2px 12px rgba(99, 102, 241, .22), 0 4px 24px rgba(99, 102, 241, .15)),inset 0 1px 2px #6366f11f,inset 0 0 0 1px #ffffff14}.layout-container .n-menu.n-menu--collapsed .n-menu-item-content--child-active{backdrop-filter:blur(var(--menu-selected-blur, 16px)) saturate(var(--menu-selected-saturate, 135%));-webkit-backdrop-filter:blur(var(--menu-selected-blur, 16px)) saturate(var(--menu-selected-saturate, 135%))}.layout-container .n-menu.n-menu--collapsed .n-menu-item-content--child-active:after{border-radius:var(--menu-border-radius, 10px);box-shadow:0 0 14px #6366f140,0 0 20px #6366f126}.layout-container .n-menu.n-menu--collapsed .n-menu-item:hover{transform:scale(1.05)}.layout-container .n-menu.n-menu--collapsed .n-menu-item:hover:before{background:#ffffff1a;box-shadow:0 4px 16px #00000026,inset 0 1px #ffffff26}.n-menu--collapsed .n-menu-item-content__icon{color:#e5e7ebe6!important}.layout-container .n-layout{width:100%;min-width:0}.no-horizontal-scroll{overflow-x:hidden!important}.layout-container .n-submenu{margin:4px 0}.layout-container .n-submenu>.n-menu-item-content{padding:10px 16px}.layout-container .n-submenu-children .n-menu-item{margin:2px 0;position:relative}.layout-container .n-submenu-children .n-menu-item:before{content:none}.layout-container .n-submenu-children .n-menu-item-content{padding:8px 16px 8px 46px;font-size:13px}.layout-container .n-submenu-children .n-menu-item-content__icon{width:16px!important;height:16px!important;font-size:16px!important;margin-right:8px}.layout-container .n-submenu-children .n-menu-item-content__icon .n-icon{width:16px!important;height:16px!important;font-size:16px!important}.layout-container .n-submenu-children .n-menu-item-content__icon svg{width:16px!important;height:16px!important}.layout-container .n-submenu-children .n-menu-item:hover{transform:translate(2px)}.layout-container .n-submenu-children{background:#0000000d;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);margin:2px 0;padding:4px 0;border-left:2px solid rgba(99,102,241,.3)}.layout-container .n-menu-item-group-title{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:1.2px;padding:12px 16px 6px;opacity:.5;position:relative}.layout-container .n-menu-item-group-title:after{content:"";position:absolute;bottom:0;left:16px;right:16px;height:1px;background:linear-gradient(to right,transparent,rgba(99,102,241,.2),transparent)}.layout-container .n-menu-divider{margin:8px 16px;height:1px;background:linear-gradient(to right,transparent,rgba(255,255,255,.1),transparent);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.layout-container .n-menu-item.n-menu-item--loading:before{background:linear-gradient(90deg,#6366f11a,#8b5cf633,#6366f11a);background-size:200% 100%;animation:shimmer 2s infinite}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.layout-container .n-menu-item.n-menu-item--disabled{opacity:.4;filter:grayscale(.5);cursor:not-allowed}.layout-container .n-menu-item.n-menu-item--disabled:before{background:#ffffff03}.layout-container .n-menu-item.n-menu-item--disabled:hover{transform:none}.fade-slide-enter-from{opacity:0;transform:translate(20px)}.fade-slide-leave-to{opacity:0;transform:translate(-20px)}.layout-coming-soon{display:flex;align-items:center;justify-content:center;height:100vh;background-color:var(--app-bg-content)}.coming-soon-content{text-align:center;max-width:400px;padding:40px;border-radius:12px;background-color:var(--app-bg-surface);box-shadow:0 8px 24px #0000001a}.coming-soon-icon{font-size:64px;margin-bottom:16px}.coming-soon-title{font-size:24px;font-weight:600;margin-bottom:8px;color:var(--app-text-primary)}.coming-soon-desc{font-size:16px;color:var(--app-text-secondary);line-height:1.5}.top-layout-container{height:100vh;display:flex;flex-direction:column;overflow:hidden;background-color:var(--app-bg-body)}.top-navbar{height:64px;display:flex;align-items:center;padding:0 24px;background:linear-gradient(135deg,#fffffff2,#fffffffa);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-bottom:1px solid rgba(0,0,0,.06);box-shadow:0 2px 8px #00000008,0 1px 2px #00000005;position:relative;z-index:1000;transition:all .3s cubic-bezier(.4,0,.2,1)}.navbar-left{display:flex;align-items:center;gap:16px;flex-shrink:0}.logo-container{position:relative;display:flex;align-items:center;justify-content:center;width:40px;height:40px}.logo-glow{position:absolute;inset:0;background:radial-gradient(circle,rgba(99,102,241,.25) 0%,transparent 70%);border-radius:8px;filter:blur(8px);animation:pulse-glow 3s ease-in-out infinite}.logo-video{position:relative;z-index:10;border-radius:8px;box-shadow:0 4px 12px #6366f133,0 2px 4px #0000001a;transition:all .3s cubic-bezier(.4,0,.2,1)}.logo-video:hover{transform:scale(1.05) rotate(2deg);box-shadow:0 6px 16px #6366f14d,0 3px 6px #00000026}.brand-name{display:flex;flex-direction:column;gap:2px}.brand-title{font-size:18px;font-weight:700;background:linear-gradient(135deg,#6366f1,#8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:.5px;line-height:1}.brand-subtitle{font-size:11px;font-weight:500;color:var(--app-text-tertiary);letter-spacing:2px;line-height:1;opacity:.7}.navbar-divider{width:1px;height:24px;background:linear-gradient(to bottom,transparent,rgba(99,102,241,.3) 50%,transparent);margin:0 8px}.navbar-center{flex:1;display:flex;align-items:center;min-width:0;padding:0 24px}.navbar-center :deep(.n-menu){background:transparent!important}.navbar-center :deep(.n-menu-item){margin:0 4px;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1)}.navbar-center :deep(.n-menu-item--selected):after{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);width:24px;height:3px;background:linear-gradient(90deg,#6366f1,#8b5cf6);border-radius:2px 2px 0 0;box-shadow:0 -2px 8px #6366f14d}.navbar-center :deep(.n-menu-item-content__icon){font-size:18px!important;margin-right:8px}.navbar-center :deep(.n-menu-item--selected .n-menu-item-content__icon){filter:drop-shadow(0 0 4px rgba(99,102,241,.4))}.navbar-center :deep(.n-submenu){margin:0 4px}.navbar-center :deep(.n-submenu-children){background:#fffffffa;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:12px;padding:8px;box-shadow:0 8px 24px #00000014,0 2px 8px #0000000a;border:1px solid rgba(0,0,0,.06);margin-top:8px}.main-content{flex:1;display:flex;flex-direction:column;overflow:hidden;background-color:var(--app-bg-content)}.page-content{flex:1;padding:24px;overflow-y:auto;overflow-x:hidden}.page-content::-webkit-scrollbar{width:8px;height:8px}.page-content::-webkit-scrollbar-track{background:transparent}.page-content::-webkit-scrollbar-thumb{background:#0000001a;border-radius:4px;transition:background .3s}.page-content::-webkit-scrollbar-thumb:hover{background:#0003}.dark-theme .page-content::-webkit-scrollbar-thumb{background:#ffffff1a}.dark-theme .page-content::-webkit-scrollbar-thumb:hover{background:#fff3}@media(max-width:1200px){.navbar-center{padding:0 16px}.brand-subtitle{display:none}}@media(max-width:768px){.top-navbar{padding:0 16px}.navbar-divider{display:none}.action-buttons{gap:4px}.page-content{padding:0 16px 16px}}.dark-theme .navbar-center :deep(.n-submenu-children){background:#1c1c21fa;border-color:#ffffff14;box-shadow:0 8px 24px #0000004d,0 2px 8px #0003}.dark-theme .brand-subtitle{color:#ffffff80}.dark-theme .action-btn span{color:#ffffffb3}.dark-theme .action-btn:hover span{color:#8b5cf6}.dark-theme .user-dropdown{color:#ffffffe6}.fade-slide-enter-active,.fade-slide-leave-active{transition:all .3s cubic-bezier(.4,0,.2,1)}.fade-slide-enter-from{opacity:0;transform:translateY(20px)}.fade-slide-leave-to{opacity:0;transform:translateY(-20px)}.fade-transform-enter-active,.fade-transform-leave-active{transition:all .3s cubic-bezier(.4,0,.2,1)}.fade-transform-enter-from{opacity:0;transform:scale(.95)}.fade-transform-leave-to{opacity:0;transform:scale(1.05)}.fade-zoom-enter-active,.fade-zoom-leave-active{transition:all .3s cubic-bezier(.4,0,.2,1)}.fade-zoom-enter-from,.fade-zoom-leave-to{opacity:0;transform:scale(.8)}.responsive-menu[data-v-d329131b]{display:flex;align-items:center;width:100%;gap:0}.responsive-menu__visible[data-v-d329131b]{flex:0 1 auto;min-width:0;overflow:hidden}.responsive-menu__visible[data-v-d329131b] .n-menu{background-color:transparent!important}.responsive-menu__visible[data-v-d329131b] .n-menu-item{position:relative;font-weight:500;letter-spacing:.01em;transition:all .25s cubic-bezier(.4,0,.2,1)}.responsive-menu__visible[data-v-d329131b] .n-menu-item-content-header{overflow:visible!important;text-overflow:clip!important;white-space:nowrap!important}.responsive-menu__visible[data-v-d329131b] .n-menu-item-content{overflow:visible!important}.responsive-menu__visible[data-v-d329131b] .n-menu-item:after{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%) scaleX(0);width:60%;height:2px;background:linear-gradient(90deg,transparent,currentColor,transparent);opacity:0;transition:all .3s cubic-bezier(.4,0,.2,1)}.responsive-menu__visible[data-v-d329131b] .n-menu-item.n-menu-item--selected:after{transform:translate(-50%) scaleX(1);opacity:.5}.responsive-menu__visible[data-v-d329131b] .n-menu-item:hover{transform:translateY(-1px)}.responsive-menu__visible[data-v-d329131b] .n-menu-item.n-menu-item--selected{box-shadow:0 2px 8px -2px #1e40af26,0 1px 3px #1e40af1a}.responsive-menu__more[data-v-d329131b]{flex-shrink:0;margin-left:4px}.responsive-menu__more-btn[data-v-d329131b]{min-width:42px;height:42px;padding:0 18px!important;border-radius:10px!important;background-color:transparent!important;transition:all .25s cubic-bezier(.4,0,.2,1)}.responsive-menu__more-btn[data-v-d329131b]:before,.responsive-menu__more-btn[data-v-d329131b] .n-button__border,.responsive-menu__more-btn[data-v-d329131b] .n-button__state-border{display:none!important}.responsive-menu__more-btn[data-v-d329131b]:hover{background-color:#1e40af0f!important;transform:translateY(-1px)}.dots-icon[data-v-d329131b]{display:inline-flex;align-items:center;justify-content:center;gap:3px;width:20px;height:20px}.dots-icon span[data-v-d329131b]{width:4px;height:4px;border-radius:50%;background-color:currentColor;opacity:.85}.mix-layout-container{display:flex;width:100%;height:100vh;overflow:hidden}.first-level-menu{position:relative;width:80px;height:100vh;display:flex;flex-direction:column;align-items:center;z-index:1000;transition:all .3s cubic-bezier(.4,0,.2,1)}.first-level-menu.light-theme{background:linear-gradient(180deg,#fffffff2,#fffffffa);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-right:1px solid rgba(0,0,0,.06);box-shadow:2px 0 8px #00000008,1px 0 2px #00000005}.first-level-menu.light-theme:before{content:"";position:absolute;top:0;right:0;bottom:0;width:1px;background:linear-gradient(180deg,transparent,rgba(99,102,241,.2) 50%,transparent)}.first-level-menu.dark-theme{background:linear-gradient(180deg,#1c1c21f2,#1c1c21fa);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-right:1px solid rgba(255,255,255,.08);box-shadow:2px 0 8px #0003,1px 0 2px #0000001a}.first-level-menu.dark-theme:before{content:"";position:absolute;top:0;right:0;bottom:0;width:1px;background:linear-gradient(180deg,transparent,rgba(99,102,241,.3) 50%,transparent)}.first-level-menu .logo-container{position:relative;width:100%;height:80px;display:flex;align-items:center;justify-content:center;flex-shrink:0;border-bottom:1px solid rgba(94,92,92,.08)}.light-theme .first-level-menu .logo-container{border-bottom-color:#0000000f}.dark-theme .first-level-menu .logo-container{border-bottom-color:#ffffff14}.first-level-menu .logo-glow{position:absolute;inset:0;background:radial-gradient(circle,rgba(99,102,241,.25) 0%,transparent 70%);border-radius:12px;filter:blur(12px);animation:pulse-glow 3s ease-in-out infinite}.first-level-menu .logo-video{position:relative;z-index:10;border-radius:10px;box-shadow:0 4px 12px #6366f133,0 2px 4px #0000001a;transition:all .3s cubic-bezier(.4,0,.2,1)}.first-level-menu .logo-video:hover{transform:scale(1.05) rotate(2deg);box-shadow:0 6px 16px #6366f14d,0 3px 6px #00000026}.first-level-menu .first-menu-list{flex:1;width:100%;padding:0 0 16px;overflow-y:auto;overflow-x:hidden}.first-level-menu .first-menu-list::-webkit-scrollbar{width:0;display:none}.first-level-menu .first-menu-item{position:relative;width:100%;height:72px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);margin-bottom:8px}.first-level-menu .first-menu-item .menu-item-content{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;border:1px solid transparent}.first-level-menu .first-menu-item .menu-item-label{font-size:11px;font-weight:500;line-height:1;transition:all .3s cubic-bezier(.4,0,.2,1);max-width:64px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:.7;letter-spacing:.3px}.first-level-menu .first-menu-item .menu-item-text{font-size:18px;font-weight:600;line-height:1}.first-level-menu.light-theme .first-menu-item .menu-item-content{color:#000000a6}.first-level-menu.light-theme .first-menu-item .menu-item-label{color:#000000d9}.first-level-menu.light-theme .first-menu-item:hover .menu-item-content{transform:translateY(-2px);background:linear-gradient(135deg,#ffffffe6,#fffc);backdrop-filter:blur(10px) saturate(150%);-webkit-backdrop-filter:blur(10px) saturate(150%);color:#2080f0;box-shadow:0 4px 12px #2080f01a,0 2px 4px #0000000d,inset 0 1px #fffc;border:1px solid rgba(32,128,240,.2)}.first-level-menu.light-theme .first-menu-item:hover .menu-item-label{color:#2080f0;opacity:1}.first-level-menu.light-theme .first-menu-item.active .menu-item-content{background:linear-gradient(135deg,#2080f026,#4098fc1f);backdrop-filter:blur(10px) saturate(150%);-webkit-backdrop-filter:blur(10px) saturate(150%);color:#2080f0!important;box-shadow:0 4px 16px #2080f033,0 2px 8px #2080f01a,inset 0 1px #fff9,inset 0 -1px #2080f01a;border:1px solid rgba(32,128,240,.3)}.first-level-menu.light-theme .first-menu-item.active .menu-item-label{color:#2080f0!important;opacity:1;font-weight:600}.first-level-menu.light-theme .first-menu-item.active:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:28px;background:linear-gradient(180deg,#2080f0,#4098fc);border-radius:0 2px 2px 0;box-shadow:2px 0 8px #2080f080,0 0 12px #2080f04d}.first-level-menu.dark-theme .first-menu-item .menu-item-content{color:#ffffffa6}.first-level-menu.dark-theme .first-menu-item .menu-item-label{color:#ffffffd9}.first-level-menu.dark-theme .first-menu-item:hover .menu-item-content{transform:translateY(-2px);background:linear-gradient(135deg,#ffffff1f,#ffffff14);backdrop-filter:blur(10px) saturate(150%);-webkit-backdrop-filter:blur(10px) saturate(150%);color:#4098fc;box-shadow:0 4px 12px #2080f026,0 2px 4px #0000001a,inset 0 1px #ffffff26;border:1px solid rgba(64,152,252,.25)}.first-level-menu.dark-theme .first-menu-item:hover .menu-item-label{color:#4098fc;opacity:1}.first-level-menu.dark-theme .first-menu-item.active .menu-item-content{background:linear-gradient(135deg,#2080f040,#4098fc2e);backdrop-filter:blur(10px) saturate(150%);-webkit-backdrop-filter:blur(10px) saturate(150%);color:#4098fc!important;box-shadow:0 4px 16px #2080f040,0 2px 8px #2080f026,inset 0 1px #fff3,inset 0 -1px #2080f033;border:1px solid rgba(64,152,252,.35)}.first-level-menu.dark-theme .first-menu-item.active .menu-item-label{color:#4098fc!important;opacity:1;font-weight:600}.first-level-menu.dark-theme .first-menu-item.active:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:28px;background:linear-gradient(180deg,#2080f0,#4098fc);border-radius:0 2px 2px 0;box-shadow:2px 0 8px #2080f099,0 0 12px #2080f066}.second-level-menu-popup{position:fixed;left:80px;top:0;width:220px;height:100vh;z-index:1001;display:flex;flex-direction:column;transition:all .3s cubic-bezier(.4,0,.2,1)}.second-level-menu-popup.light-theme{background:#fffffffa;backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-right:1px solid rgba(0,0,0,.06);box-shadow:2px 0 24px #00000014,1px 0 8px #0000000a}.second-level-menu-popup.dark-theme{background:#1c1c21fa;backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-right:1px solid rgba(255,255,255,.08);box-shadow:2px 0 24px #0000004d,1px 0 8px #0003}.second-level-menu-popup .second-menu-header{height:80px;padding:0 20px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid rgba(94,92,92,.08);flex-shrink:0}.light-theme .second-level-menu-popup .second-menu-header{border-bottom-color:#0000000f}.dark-theme .second-level-menu-popup .second-menu-header{border-bottom-color:#ffffff14}.second-level-menu-popup .second-menu-header .brand-info{display:flex;flex-direction:column;gap:4px;align-items:center}.second-level-menu-popup .second-menu-header .brand-title{font-size:16px;font-weight:700;background:linear-gradient(135deg,#6366f1,#8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:.5px;line-height:1}.second-level-menu-popup .second-menu-header .brand-subtitle{font-size:11px;font-weight:500;letter-spacing:1px;line-height:1;opacity:.6}.light-theme .second-level-menu-popup .second-menu-header .brand-subtitle{color:#00000073}.dark-theme .second-level-menu-popup .second-menu-header .brand-subtitle{color:#ffffff73}.second-level-menu-popup .second-menu-list{flex:1;padding:12px;overflow-y:auto;overflow-x:hidden}.second-level-menu-popup .second-menu-list::-webkit-scrollbar{width:6px}.second-level-menu-popup .second-menu-list::-webkit-scrollbar-track{background:transparent}.second-level-menu-popup .second-menu-list::-webkit-scrollbar-thumb{border-radius:3px;transition:background .3s}.light-theme .second-level-menu-popup .second-menu-list::-webkit-scrollbar-thumb{background:#0000001a}.light-theme .second-level-menu-popup .second-menu-list::-webkit-scrollbar-thumb:hover{background:#0003}.dark-theme .second-level-menu-popup .second-menu-list::-webkit-scrollbar-thumb{background:#ffffff1a}.dark-theme .second-level-menu-popup .second-menu-list::-webkit-scrollbar-thumb:hover{background:#fff3}.second-level-menu-popup .second-menu-group{margin-bottom:12px}.second-level-menu-popup .second-menu-group .group-title{display:flex;align-items:center;gap:8px;padding:8px 16px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;opacity:.6}.light-theme .second-level-menu-popup .second-menu-group .group-title{color:#00000073}.dark-theme .second-level-menu-popup .second-menu-group .group-title{color:#ffffff73}.light-theme .second-level-menu-popup .second-menu-group .group-title .menu-icon{color:#00000073!important}.dark-theme .second-level-menu-popup .second-menu-group .group-title .menu-icon{color:#ffffff73!important}.light-theme .second-level-menu-popup .second-menu-group .group-title .menu-text{color:#00000073!important}.dark-theme .second-level-menu-popup .second-menu-group .group-title .menu-text{color:#ffffff73!important}.second-level-menu-popup .second-menu-item{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:10px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);margin-bottom:6px;position:relative}.second-level-menu-popup .second-menu-item.sub-item{padding-left:32px;font-size:13px}.second-level-menu-popup .second-menu-item .item-title{font-size:14px;font-weight:500;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color .3s}.second-level-menu-popup.light-theme .second-menu-item{color:#000000a6}.second-level-menu-popup.light-theme .second-menu-item:hover{background:#6366f114;color:#6366f1;transform:translate(4px);box-shadow:0 2px 8px #6366f11a}.second-level-menu-popup.light-theme .second-menu-item:hover :deep(.c-icon),.second-level-menu-popup.light-theme .second-menu-item:hover .item-title{color:#6366f1!important}.second-level-menu-popup.light-theme .second-menu-item.active{background:linear-gradient(135deg,#6366f11f,#8b5cf614)!important;color:#6366f1!important;font-weight:600!important;box-shadow:0 2px 8px #6366f126,inset 0 1px #ffffff1a!important}.second-level-menu-popup.light-theme .second-menu-item.active :deep(.c-icon){color:#6366f1!important;filter:drop-shadow(0 0 4px rgba(99,102,241,.4))!important}.second-level-menu-popup.light-theme .second-menu-item.active .item-title{color:#6366f1!important}.second-level-menu-popup.light-theme .second-menu-item.active:before{content:""!important;position:absolute!important;left:0!important;top:50%!important;transform:translateY(-50%)!important;width:3px!important;height:20px!important;background:linear-gradient(180deg,#6366f1,#8b5cf6)!important;border-radius:0 2px 2px 0!important;box-shadow:2px 0 8px #6366f14d!important}.second-level-menu-popup.dark-theme .second-menu-item{color:#ffffffa6}.second-level-menu-popup.dark-theme .second-menu-item:hover{background:#6366f126;color:#8b5cf6;transform:translate(4px);box-shadow:0 2px 8px #8b5cf626}.second-level-menu-popup.dark-theme .second-menu-item:hover :deep(.c-icon),.second-level-menu-popup.dark-theme .second-menu-item:hover .item-title{color:#8b5cf6!important}.second-level-menu-popup.dark-theme .second-menu-item.active{background:linear-gradient(135deg,#6366f133,#8b5cf626)!important;color:#8b5cf6!important;font-weight:600!important;box-shadow:0 2px 8px #8b5cf633,inset 0 1px #ffffff0d!important}.second-level-menu-popup.dark-theme .second-menu-item.active :deep(.c-icon){color:#8b5cf6!important;filter:drop-shadow(0 0 4px rgba(139,92,246,.4))!important}.second-level-menu-popup.dark-theme .second-menu-item.active .item-title{color:#8b5cf6!important}.second-level-menu-popup.dark-theme .second-menu-item.active:before{content:""!important;position:absolute!important;left:0!important;top:50%!important;transform:translateY(-50%)!important;width:3px!important;height:20px!important;background:linear-gradient(180deg,#6366f1,#8b5cf6)!important;border-radius:0 2px 2px 0!important;box-shadow:2px 0 8px #6366f14d!important}.slide-fade-enter-active{transition:all .25s cubic-bezier(.4,0,.2,1)}.slide-fade-leave-active{transition:all .2s cubic-bezier(.4,0,1,1)}.slide-fade-enter-from,.slide-fade-leave-to{transform:translate(-20px);opacity:0}.main-layout{flex:1;display:flex;flex-direction:column;overflow:hidden}@media(max-width:768px){.first-level-menu{width:64px}.first-level-menu .logo-container{height:64px}.first-level-menu .logo-container .logo-video{width:32px;height:32px}.first-level-menu .first-menu-item{height:60px}.first-level-menu .first-menu-item .menu-item-content{width:40px;height:40px}.first-level-menu .first-menu-item .menu-item-label{font-size:11px}.second-level-menu-popup{left:64px;width:200px}.second-level-menu-popup .second-menu-header{height:64px;padding:0 16px}.second-level-menu-popup .second-menu-header .menu-title{font-size:15px}}.mix-top-layout-container{display:flex;flex-direction:row;width:100%;height:100vh;overflow:hidden}.top-navbar{height:64px;display:flex;align-items:center;padding:0 24px;position:relative;z-index:1000;transition:all .3s cubic-bezier(.4,0,.2,1)}.top-navbar.light-theme{background:linear-gradient(135deg,#fffffff2,#fffffffa);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-bottom:1px solid rgba(0,0,0,.06);box-shadow:0 2px 8px #00000008,0 1px 2px #00000005}.top-navbar.light-theme:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(99,102,241,.2) 50%,transparent)}.top-navbar.dark-theme{background:linear-gradient(135deg,#1c1c21f2,#1c1c21fa);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-bottom:1px solid rgba(255,255,255,.08);box-shadow:0 2px 8px #0003,0 1px 2px #0000001a}.top-navbar.dark-theme:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(99,102,241,.3) 50%,transparent)}.top-navbar .logo-container{position:relative;display:flex;align-items:center;justify-content:center;width:40px;height:40px}.top-navbar .logo-glow{position:absolute;inset:0;background:radial-gradient(circle,rgba(99,102,241,.25) 0%,transparent 70%);border-radius:8px;filter:blur(8px);animation:pulse-glow 3s ease-in-out infinite}.top-navbar .logo-video{position:relative;z-index:10;border-radius:8px;box-shadow:0 4px 12px #6366f133,0 2px 4px #0000001a;transition:all .3s cubic-bezier(.4,0,.2,1)}.top-navbar .logo-video:hover{transform:scale(1.05) rotate(2deg);box-shadow:0 6px 16px #6366f14d,0 3px 6px #00000026}.top-navbar .brand-name{display:flex;flex-direction:column;gap:2px}.top-navbar .brand-title{font-size:18px;font-weight:700;background:linear-gradient(135deg,#6366f1,#8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:.5px;line-height:1}.top-navbar .brand-subtitle{font-size:11px;font-weight:500;letter-spacing:2px;line-height:1;opacity:.7}.light-theme .top-navbar .brand-subtitle{color:#00000073}.dark-theme .top-navbar .brand-subtitle{color:#ffffff80}.top-navbar .navbar-divider{width:1px;height:24px;background:linear-gradient(to bottom,transparent,rgba(99,102,241,.3) 50%,transparent);margin:0 8px}.top-navbar .navbar-center{flex:1;display:flex;align-items:center;min-width:0;padding:0 24px}.top-navbar .navbar-center :deep(.n-menu){background-color:transparent!important}.top-navbar .navbar-center :deep(.n-menu-item){margin:0 4px;position:relative;transition:all .3s cubic-bezier(.4,0,.2,1)}.top-navbar .navbar-center :deep(.n-menu-item--selected):after{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);width:24px;height:3px;background:linear-gradient(90deg,#6366f1,#8b5cf6);border-radius:2px 2px 0 0;box-shadow:0 -2px 8px #6366f14d}.top-navbar .navbar-center :deep(.n-menu-item-content__icon){font-size:18px!important;margin-right:8px}.top-navbar .navbar-center :deep(.n-menu-item--selected .n-menu-item-content__icon){filter:drop-shadow(0 0 4px rgba(99,102,241,.4))}.top-navbar .navbar-center :deep(.n-submenu){margin:0 4px}.top-navbar .navbar-center :deep(.n-submenu-children){background:#fffffffa;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:12px;padding:8px;box-shadow:0 8px 24px #00000014,0 2px 8px #0000000a;border:1px solid rgba(0,0,0,.06);margin-top:8px}.top-navbar.dark-theme .navbar-center :deep(.n-submenu-children){background:#1c1c21fa;border-color:#ffffff14;box-shadow:0 8px 24px #0000004d,0 2px 8px #0003}.first-level-sidebar{position:relative;width:80px;height:100%;display:flex;flex-direction:column;align-items:center;z-index:999;transition:all .3s cubic-bezier(.4,0,.2,1)}.first-level-sidebar.light-theme{background:linear-gradient(180deg,#fffffff2,#fffffffa);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-right:1px solid rgba(0,0,0,.06);box-shadow:2px 0 8px #00000008,1px 0 2px #00000005}.first-level-sidebar.light-theme:before{content:"";position:absolute;top:0;right:0;bottom:0;width:1px;background:linear-gradient(180deg,transparent,rgba(99,102,241,.2) 50%,transparent)}.first-level-sidebar.dark-theme{background:linear-gradient(180deg,#1c1c21f2,#1c1c21fa);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-right:1px solid rgba(255,255,255,.08);box-shadow:2px 0 8px #0003,1px 0 2px #0000001a}.first-level-sidebar.dark-theme:before{content:"";position:absolute;top:0;right:0;bottom:0;width:1px;background:linear-gradient(180deg,transparent,rgba(99,102,241,.3) 50%,transparent)}.first-level-sidebar .logo-container{position:relative;width:100%;height:80px;display:flex;align-items:center;justify-content:center;flex-shrink:0;border-bottom:1px solid rgba(94,92,92,.08)}.light-theme .first-level-sidebar .logo-container{border-bottom-color:#0000000f}.dark-theme .first-level-sidebar .logo-container{border-bottom-color:#ffffff14}.first-level-sidebar .logo-glow{position:absolute;inset:0;background:radial-gradient(circle,rgba(99,102,241,.25) 0%,transparent 70%);border-radius:12px;filter:blur(12px);animation:pulse-glow 3s ease-in-out infinite}.first-level-sidebar .logo-video{position:relative;z-index:10;border-radius:10px;box-shadow:0 4px 12px #6366f133,0 2px 4px #0000001a;transition:all .3s cubic-bezier(.4,0,.2,1)}.first-level-sidebar .logo-video:hover{transform:scale(1.05) rotate(2deg);box-shadow:0 6px 16px #6366f14d,0 3px 6px #00000026}.first-level-sidebar .first-menu-list{flex:1;width:100%;padding:0 0 16px;overflow-y:auto;overflow-x:hidden}.first-level-sidebar .first-menu-list::-webkit-scrollbar{width:0;display:none}.first-level-sidebar .first-menu-item{position:relative;width:100%;height:72px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);margin-bottom:8px}.first-level-sidebar .first-menu-item .menu-item-content{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;border:1px solid transparent}.first-level-sidebar .first-menu-item .menu-item-label{font-size:11px;font-weight:500;line-height:1;transition:all .3s cubic-bezier(.4,0,.2,1);max-width:64px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:.7;letter-spacing:.3px}.first-level-sidebar .first-menu-item .menu-item-text{font-size:18px;font-weight:600;line-height:1}.first-level-sidebar.light-theme .first-menu-item .menu-item-content{color:#000000a6}.first-level-sidebar.light-theme .first-menu-item .menu-item-label{color:#000000d9}.first-level-sidebar.light-theme .first-menu-item:hover .menu-item-content{transform:translateY(-2px);background:linear-gradient(135deg,#ffffffe6,#fffc);backdrop-filter:blur(10px) saturate(150%);-webkit-backdrop-filter:blur(10px) saturate(150%);color:#2080f0;box-shadow:0 4px 12px #2080f01a,0 2px 4px #0000000d,inset 0 1px #fffc;border:1px solid rgba(32,128,240,.2)}.first-level-sidebar.light-theme .first-menu-item:hover .menu-item-label{color:#2080f0;opacity:1}.first-level-sidebar.light-theme .first-menu-item.active .menu-item-content{background:linear-gradient(135deg,#2080f026,#4098fc1f);backdrop-filter:blur(10px) saturate(150%);-webkit-backdrop-filter:blur(10px) saturate(150%);color:#2080f0!important;box-shadow:0 4px 16px #2080f033,0 2px 8px #2080f01a,inset 0 1px #fff9,inset 0 -1px #2080f01a;border:1px solid rgba(32,128,240,.3)}.first-level-sidebar.light-theme .first-menu-item.active .menu-item-label{color:#2080f0!important;opacity:1;font-weight:600}.first-level-sidebar.light-theme .first-menu-item.active:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:28px;background:linear-gradient(180deg,#2080f0,#4098fc);border-radius:0 2px 2px 0;box-shadow:2px 0 8px #2080f080,0 0 12px #2080f04d}.first-level-sidebar.dark-theme .first-menu-item .menu-item-content{color:#ffffffa6}.first-level-sidebar.dark-theme .first-menu-item .menu-item-label{color:#ffffffd9}.first-level-sidebar.dark-theme .first-menu-item:hover .menu-item-content{transform:translateY(-2px);background:linear-gradient(135deg,#ffffff1f,#ffffff14);backdrop-filter:blur(10px) saturate(150%);-webkit-backdrop-filter:blur(10px) saturate(150%);color:#4098fc;box-shadow:0 4px 12px #2080f026,0 2px 4px #0000001a,inset 0 1px #ffffff26;border:1px solid rgba(64,152,252,.25)}.first-level-sidebar.dark-theme .first-menu-item:hover .menu-item-label{color:#4098fc;opacity:1}.first-level-sidebar.dark-theme .first-menu-item.active .menu-item-content{background:linear-gradient(135deg,#2080f040,#4098fc2e);backdrop-filter:blur(10px) saturate(150%);-webkit-backdrop-filter:blur(10px) saturate(150%);color:#4098fc!important;box-shadow:0 4px 16px #2080f040,0 2px 8px #2080f026,inset 0 1px #fff3,inset 0 -1px #2080f033;border:1px solid rgba(64,152,252,.35)}.first-level-sidebar.dark-theme .first-menu-item.active .menu-item-label{color:#4098fc!important;opacity:1;font-weight:600}.first-level-sidebar.dark-theme .first-menu-item.active:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:28px;background:linear-gradient(180deg,#2080f0,#4098fc);border-radius:0 2px 2px 0;box-shadow:2px 0 8px #2080f099,0 0 12px #2080f066}.mix-top-layout-container .main-area,.mix-top-layout-container .content-layout{flex:1;display:flex;flex-direction:column;overflow:hidden}.mix-top-layout-container .main-content{flex:1;display:flex;flex-direction:column;overflow:hidden;background:#f4f7f9}.dark-theme .mix-top-layout-container .main-content{background:#121212}.mix-top-layout-container .page-content{flex:1;padding:24px;overflow-y:auto;overflow-x:hidden}.mix-top-layout-container .page-content::-webkit-scrollbar{width:8px;height:8px}.mix-top-layout-container .page-content::-webkit-scrollbar-track{background:transparent}.mix-top-layout-container .page-content::-webkit-scrollbar-thumb{background:#0000001a;border-radius:4px;transition:background .3s}.mix-top-layout-container .page-content::-webkit-scrollbar-thumb:hover{background:#0003}.dark-theme .mix-top-layout-container .page-content::-webkit-scrollbar-thumb{background:#ffffff1a}.dark-theme .mix-top-layout-container .page-content::-webkit-scrollbar-thumb:hover{background:#fff3}.mix-top-layout-container .tags-view-container{flex-shrink:0;background:var(--app-bg-color);border-bottom:1px solid var(--color-border);transition:all .3s cubic-bezier(.4,0,.2,1)}@media(max-width:1200px){.top-navbar .navbar-center{padding:0 16px}.top-navbar .brand-subtitle{display:none}}@media(max-width:768px){.top-navbar{padding:0 16px}.top-navbar .navbar-divider{display:none}.top-navbar .navbar-right{gap:16px}.first-level-sidebar{width:64px}.first-level-sidebar .first-menu-item{height:60px}.first-level-sidebar .first-menu-item .menu-item-content{width:32px;height:32px}.first-level-sidebar .first-menu-item .menu-item-label{font-size:10px}}.reverse-horizontal-mix-layout-container{width:100%;height:100vh;display:flex;flex-direction:column;overflow:hidden}.reverse-horizontal-mix-layout-container .top-navbar{height:64px;display:flex;align-items:center;padding:0 24px;background:linear-gradient(135deg,#f8fafcf2,#f1f5f9fa);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-bottom:1px solid rgba(0,0,0,.08);box-shadow:0 2px 8px #0000000d,0 1px 2px #00000008;position:relative;z-index:1000;transition:all .3s cubic-bezier(.4,0,.2,1)}.reverse-horizontal-mix-layout-container .top-navbar:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(30,64,175,.2) 50%,transparent)}.reverse-horizontal-mix-layout-container .top-navbar.dark-theme{background:linear-gradient(135deg,#1c1c21f2,#1c1c21fa);border-bottom-color:#ffffff14;box-shadow:0 2px 8px #0003,0 1px 2px #0000001a}.reverse-horizontal-mix-layout-container .top-navbar.dark-theme:before{background:linear-gradient(90deg,transparent,rgba(99,102,241,.3) 50%,transparent)}.reverse-horizontal-mix-layout-container .top-navbar .navbar-left{display:flex;align-items:center;gap:16px;flex-shrink:0}.reverse-horizontal-mix-layout-container .top-navbar .navbar-left .logo-container{position:relative;width:40px;height:40px;display:flex;align-items:center;justify-content:center}.reverse-horizontal-mix-layout-container .top-navbar .navbar-left .logo-container .logo-glow{position:absolute;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle,rgba(30,64,175,.3) 0%,transparent 70%);animation:pulse 2s ease-in-out infinite}.reverse-horizontal-mix-layout-container .top-navbar .navbar-left .logo-container .logo-video{position:relative;z-index:1;border-radius:8px}.reverse-horizontal-mix-layout-container .top-navbar .navbar-left .brand-name{display:flex;flex-direction:column;gap:2px}.reverse-horizontal-mix-layout-container .top-navbar .navbar-left .brand-name .brand-title{font-size:16px;font-weight:600;line-height:1.2;color:#1e40aff2;text-shadow:0 1px 2px rgba(255,255,255,.1)}.reverse-horizontal-mix-layout-container .top-navbar .navbar-left .brand-name .brand-subtitle{font-size:12px;color:#1e40afb3;line-height:1}.reverse-horizontal-mix-layout-container .top-navbar .navbar-left .navbar-divider{width:1px;height:24px;background:#1e40af33}.reverse-horizontal-mix-layout-container .top-navbar .navbar-center{flex:1;display:flex;align-items:center;min-width:0;overflow:hidden;padding:0 24px}.reverse-horizontal-mix-layout-container .top-navbar .navbar-center>*{background:transparent!important}.reverse-horizontal-mix-layout-container .tags-view-container{flex-shrink:0;background-color:var(--app-bg-surface);border-bottom:1px solid var(--app-border-color);transition:all .3s cubic-bezier(.4,0,.2,1)}.reverse-horizontal-mix-layout-container .main-area{flex:1;display:flex;flex-direction:row;overflow:hidden;position:relative}.reverse-horizontal-mix-layout-container .main-area .content-layout{flex:1;min-width:0;display:flex;flex-direction:column;overflow:hidden}.reverse-horizontal-mix-layout-container .main-area .content-layout .main-content{flex:1;display:flex;flex-direction:column;overflow:hidden;background-color:var(--app-bg-content)}.reverse-horizontal-mix-layout-container .main-area .content-layout .main-content .page-content{flex:1;padding:24px;overflow-y:auto;overflow-x:hidden}.reverse-horizontal-mix-layout-container .main-area .content-layout .main-content .page-content::-webkit-scrollbar{width:8px;height:8px}.reverse-horizontal-mix-layout-container .main-area .content-layout .main-content .page-content::-webkit-scrollbar-track{background:transparent}.reverse-horizontal-mix-layout-container .main-area .content-layout .main-content .page-content::-webkit-scrollbar-thumb{background:#0000001a;border-radius:4px;transition:background .3s}.reverse-horizontal-mix-layout-container .main-area .content-layout .main-content .page-content::-webkit-scrollbar-thumb:hover{background:#0003}.dark-theme .reverse-horizontal-mix-layout-container .main-area .content-layout .main-content .page-content::-webkit-scrollbar-thumb{background:#ffffff1a}.dark-theme .reverse-horizontal-mix-layout-container .main-area .content-layout .main-content .page-content::-webkit-scrollbar-thumb:hover{background:#fff3}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle{position:absolute;right:0;top:50%;transform:translateY(-50%);width:28px;height:56px;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:60;border-radius:8px 0 0 8px;transition:right .35s cubic-bezier(.22,1,.36,1),background .25s ease,box-shadow .25s ease}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.light-theme{background:#ffffffe0;backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);border:1px solid rgba(226,232,240,.5);border-right:none;box-shadow:-1px 0 6px #00000008}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.light-theme .toggle-icon{color:#94a3b8}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.light-theme:hover{background:#fffffff2}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.light-theme:hover .toggle-icon{color:#6366f1}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.dark-theme{background:#1e293bbf;backdrop-filter:blur(16px) saturate(130%);-webkit-backdrop-filter:blur(16px) saturate(130%);border:1px solid rgba(255,255,255,.06);border-right:none;box-shadow:-1px 0 6px #0000001f}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.dark-theme .toggle-icon{color:#64748b}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.dark-theme:hover{background:#1e293be0}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.dark-theme:hover .toggle-icon{color:#a5b4fc}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.active{right:240px;transition:right .35s cubic-bezier(.22,1,.36,1)}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle .toggle-icon{font-size:16px;transition:color .2s ease}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle:active{transform:translateY(-50%) scale(.95)}.reverse-horizontal-mix-layout-container .main-area .right-sidebar-wrapper{width:240px;flex-shrink:0;overflow:hidden;transition:width .35s cubic-bezier(.22,1,.36,1)}.reverse-horizontal-mix-layout-container .main-area .right-sidebar-wrapper.collapsed{width:0}.reverse-horizontal-mix-layout-container .main-area .right-sidebar{width:240px;min-width:240px;height:100%;display:flex;flex-direction:column;position:relative;z-index:55;overflow:hidden}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme{background:linear-gradient(165deg,#fffffff2,#f8fafce0);backdrop-filter:blur(24px) saturate(150%);-webkit-backdrop-filter:blur(24px) saturate(150%);border-left:1px solid rgba(99,102,241,.12);box-shadow:-4px 0 16px -4px #6366f10f,-1px 0 #6366f10a}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(99,102,241,.2),transparent);z-index:4}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme .sidebar-header{border-bottom:1px solid rgba(99,102,241,.1);background:linear-gradient(145deg,#6366f10f,#8b5cf608)}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme .sidebar-header .header-icon-badge{background:linear-gradient(135deg,#6366f126,#8b5cf61f);color:#4f46e5;border:1px solid rgba(99,102,241,.2)}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme .sidebar-header .header-title{color:#1e293b}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme .sidebar-menu-list .menu-group .group-label{color:#6366f199}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme .sidebar-menu-list .menu-item{color:#475569}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme .sidebar-menu-list .menu-item:hover{background:linear-gradient(145deg,#6366f114,#8b5cf60a);color:#3730a3;border-color:#6366f11f}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme .sidebar-menu-list .menu-item.active{background:linear-gradient(145deg,#6366f11f,#8b5cf614);color:#4338ca;border-color:#6366f12e;box-shadow:0 1px 4px #6366f11a}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme .sidebar-menu-list .menu-item.active:before{background:linear-gradient(180deg,#6366f1,#8b5cf6);box-shadow:1px 0 6px #6366f166}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme:after{content:"";position:absolute;bottom:0;left:0;right:0;height:40px;background:linear-gradient(to top,rgba(255,255,255,.95),transparent);pointer-events:none;z-index:3}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme{background:linear-gradient(165deg,#18181bf2,#121214e6);backdrop-filter:blur(32px) saturate(130%);-webkit-backdrop-filter:blur(32px) saturate(130%);border-left:1px solid rgba(255,255,255,.08);box-shadow:-4px 0 16px -4px #0000004d,-1px 0 #ffffff0a}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);z-index:4}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme .sidebar-header{border-bottom:1px solid rgba(255,255,255,.06);background:linear-gradient(145deg,#ffffff0d,#ffffff05)}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme .sidebar-header .header-icon-badge{background:#ffffff14;color:#a5b4fc;border:1px solid rgba(255,255,255,.1)}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme .sidebar-header .header-title{color:#e2e8f0}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme .sidebar-menu-list .menu-group .group-label{color:#ffffff59}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme .sidebar-menu-list .menu-item{color:#94a3b8}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme .sidebar-menu-list .menu-item:hover{background:linear-gradient(145deg,#ffffff14,#ffffff0a);color:#e5e7eb;border-color:#ffffff14}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme .sidebar-menu-list .menu-item.active{background:linear-gradient(145deg,#6366f12e,#8b5cf61a);color:#c7d2fe;border-color:#6366f133;box-shadow:0 1px 4px #6366f126}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme .sidebar-menu-list .menu-item.active:before{background:linear-gradient(180deg,#818cf8,#a78bfa);box-shadow:1px 0 6px #6366f180}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme:after{content:"";position:absolute;bottom:0;left:0;right:0;height:40px;background:linear-gradient(to top,rgba(18,18,20,.95),transparent);pointer-events:none;z-index:3}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-header{padding:16px 18px;display:flex;align-items:center;gap:10px;flex-shrink:0;position:relative}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-header .header-icon-badge{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .3s ease}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-header .header-title{font-size:13.5px;font-weight:600;letter-spacing:.02em}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list{flex:1;overflow-y:auto;overflow-x:hidden;padding:6px 10px 48px;position:relative;z-index:2}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list::-webkit-scrollbar{width:3px}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list::-webkit-scrollbar-track{background:transparent}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list::-webkit-scrollbar-thumb{border-radius:2px;background:#6366f11f}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list::-webkit-scrollbar-thumb:hover{background:#6366f140}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list .menu-group{margin-bottom:4px}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list .menu-group .group-label{padding:10px 12px 5px;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;display:flex;align-items:center;gap:6px}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list .menu-item{margin:2px 0;padding:0 12px;height:36px;display:flex;align-items:center;gap:9px;border-radius:10px;cursor:pointer;position:relative;font-size:13px;font-weight:450;border:1px solid transparent;transition:background .25s cubic-bezier(.4,0,.2,1),color .25s ease,border-color .25s ease,box-shadow .25s ease,transform .25s ease}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list .menu-item:hover{transform:translate(2px)}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list .menu-item .item-text{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list .menu-item.active:before{content:"";position:absolute;left:-1px;top:50%;transform:translateY(-50%);width:3px;height:16px;border-radius:0 2px 2px 0;transition:all .25s ease}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list .menu-item.active{font-weight:550}@keyframes pulse{0%,to{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}.collapse-arrow{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;position:relative;transition:transform .3s ease}.collapse-arrow .arrow-line{position:absolute;width:2px;height:8px;background-color:currentColor;border-radius:1px;opacity:.85;transition:all .3s ease}.collapse-arrow.expanded .arrow-line:first-child{transform:translate(3px) rotate(45deg);transform-origin:center bottom}.collapse-arrow.expanded .arrow-line:last-child{transform:translate(3px) rotate(-45deg);transform-origin:center top}.collapse-arrow.collapsed .arrow-line:first-child{transform:translate(-3px) rotate(-45deg);transform-origin:center bottom}.collapse-arrow.collapsed .arrow-line:last-child{transform:translate(-3px) rotate(45deg);transform-origin:center top}@media(max-width:768px){.reverse-horizontal-mix-layout-container .main-area .right-sidebar-wrapper{position:absolute;right:0;top:0;bottom:0}.reverse-horizontal-mix-layout-container .main-area .right-sidebar-wrapper .right-sidebar{box-shadow:-6px 0 32px #00000026}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.active{right:240px}}.card-layout-container{height:100vh;display:flex;flex-direction:column;overflow:hidden;background-color:var(--app-bg-body)}.top-navbar{height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;background:linear-gradient(135deg,#fffffff2,#fffffffa);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-bottom:1px solid rgba(0,0,0,.06);box-shadow:0 2px 8px #00000008,0 1px 2px #00000005;position:relative;z-index:1000;transition:all .3s cubic-bezier(.4,0,.2,1)}.top-navbar:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(99,102,241,.2) 50%,transparent)}.top-navbar.dark-theme{background:linear-gradient(135deg,#1c1c21f2,#1c1c21fa);border-bottom-color:#ffffff14;box-shadow:0 2px 8px #0003,0 1px 2px #0000001a}.top-navbar.dark-theme:before{background:linear-gradient(90deg,transparent,rgba(99,102,241,.3) 50%,transparent)}.top-navbar .navbar-left{display:flex;align-items:center;gap:16px;flex-shrink:0}.top-navbar .navbar-left .hover-trigger-area{position:relative;display:flex;align-items:center;justify-content:center;width:40px;height:40px;cursor:pointer;z-index:1001}.top-navbar .navbar-left .hover-trigger-area .menu-indicator{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:8px;background:#6366f11a;color:#6366f1;transition:all .3s cubic-bezier(.4,0,.2,1)}.top-navbar .navbar-left .hover-trigger-area .menu-indicator i{font-size:18px}.top-navbar .navbar-left .hover-trigger-area .menu-indicator:hover{background:#6366f126;transform:scale(1.05)}.dark-theme .top-navbar .navbar-left .hover-trigger-area .menu-indicator{background:#6366f133;color:#8b5cf6}.dark-theme .top-navbar .navbar-left .hover-trigger-area .menu-indicator:hover{background:#6366f14d}.top-navbar .navbar-left .menu-toggle{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:linear-gradient(135deg,#6366f11a,#8b5cf61a);border:1px solid rgba(99,102,241,.2);color:#6366f1;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.top-navbar .navbar-left .menu-toggle:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#6366f1,#8b5cf6);opacity:0;transition:opacity .3s ease}.top-navbar .navbar-left .menu-toggle i{font-size:20px;position:relative;z-index:1;transition:all .3s ease}.top-navbar .navbar-left .menu-toggle:hover{transform:translateY(-2px);box-shadow:0 8px 16px #6366f133;border-color:#6366f14d}.top-navbar .navbar-left .menu-toggle:hover:before{opacity:.1}.top-navbar .navbar-left .menu-toggle:hover i{color:#8b5cf6;transform:scale(1.1)}.top-navbar .navbar-left .menu-toggle.active{background:linear-gradient(135deg,#6366f1,#8b5cf6);border-color:transparent;color:#fff;box-shadow:0 4px 12px #6366f14d}.top-navbar .navbar-left .menu-toggle.active i{color:#fff}.top-navbar .navbar-left .menu-toggle .nav-center-button{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:linear-gradient(135deg,#18a0581a,#18a05826);border:1px solid rgba(24,160,88,.2);color:#18a058;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;margin-left:8px}.top-navbar .navbar-left .menu-toggle .nav-center-button:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#18a058,#36ad6a);opacity:0;transition:opacity .3s ease}.top-navbar .navbar-left .menu-toggle .nav-center-button i{font-size:20px;position:relative;z-index:1;transition:all .3s ease}.top-navbar .navbar-left .menu-toggle .nav-center-button:hover{transform:translateY(-2px);box-shadow:0 8px 16px #18a05833;border-color:#18a0584d}.top-navbar .navbar-left .menu-toggle .nav-center-button:hover:before{opacity:.1}.top-navbar .navbar-left .menu-toggle .nav-center-button:hover i{color:#36ad6a;transform:scale(1.1)}.top-navbar .navbar-left .menu-toggle .nav-center-button.active{background:linear-gradient(135deg,#18a058,#36ad6a);border-color:transparent;color:#fff;box-shadow:0 4px 12px #18a0584d}.top-navbar .navbar-left .menu-toggle .nav-center-button.active i{color:#fff}.top-navbar .navbar-left .logo-container{position:relative;display:flex;align-items:center;justify-content:center;width:40px;height:40px}.top-navbar .navbar-left .logo-container .logo-glow{position:absolute;inset:0;background:radial-gradient(circle,rgba(99,102,241,.25) 0%,transparent 70%);border-radius:8px;filter:blur(8px);animation:pulse-glow 3s ease-in-out infinite}.top-navbar .navbar-left .logo-container .logo-video{position:relative;z-index:10;border-radius:8px;box-shadow:0 4px 12px #6366f133,0 2px 4px #0000001a;transition:all .3s cubic-bezier(.4,0,.2,1)}.top-navbar .navbar-left .logo-container .logo-video:hover{transform:scale(1.05) rotate(2deg);box-shadow:0 6px 16px #6366f14d,0 3px 6px #00000026}.top-navbar .navbar-left .brand-name{display:flex;flex-direction:column;gap:2px}.top-navbar .navbar-left .brand-name .brand-title{font-size:18px;font-weight:700;background:linear-gradient(135deg,#6366f1,#8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:.5px;line-height:1}.top-navbar .navbar-left .brand-name .brand-subtitle{font-size:11px;font-weight:500;color:var(--app-text-tertiary);letter-spacing:2px;line-height:1;opacity:.7}.top-navbar .navbar-left .navbar-divider{width:1px;height:24px;background:linear-gradient(to bottom,transparent,rgba(99,102,241,.3) 50%,transparent);margin:0 8px}.tags-view-container{flex-shrink:0;background-color:var(--app-bg-surface);border-bottom:1px solid var(--app-border-color);transition:all .3s cubic-bezier(.4,0,.2,1)}.drawer-menu{position:fixed;top:64px;left:0;width:520px;height:calc(100vh - 64px);background:#fff;box-shadow:2px 0 8px #00000014;z-index:1000;transform:translate(-100%);transition:all .3s cubic-bezier(.4,0,.2,1);opacity:0;display:flex;flex-direction:column;border-right:1px solid #e6e6e6}.drawer-menu.dark-theme{background:#1f1f1f;border-right-color:#333;box-shadow:2px 0 8px #0000004d}.drawer-menu.visible{transform:translate(0);opacity:1}.drawer-menu .drawer-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-bottom:1px solid #e6e6e6;flex-shrink:0;background:#fafafa}.dark-theme .drawer-menu .drawer-header{border-bottom-color:#333;background:#262626}.drawer-menu .drawer-header .drawer-title{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:500;color:#333}.dark-theme .drawer-menu .drawer-header .drawer-title{color:#e6e6e6}.drawer-menu .drawer-header .drawer-title i{font-size:18px;color:#1890ff}.drawer-menu .drawer-content{flex:1;overflow-y:auto;padding:0}.drawer-menu .drawer-content::-webkit-scrollbar{width:6px}.drawer-menu .drawer-content::-webkit-scrollbar-track{background:#f5f5f5}.drawer-menu .drawer-content::-webkit-scrollbar-thumb{background:#d9d9d9;border-radius:3px;transition:background .3s}.drawer-menu .drawer-content::-webkit-scrollbar-thumb:hover{background:#bfbfbf}.dark-theme .drawer-menu .drawer-content::-webkit-scrollbar-track{background:#262626}.dark-theme .drawer-menu .drawer-content::-webkit-scrollbar-thumb{background:#434343}.dark-theme .drawer-menu .drawer-content::-webkit-scrollbar-thumb:hover{background:#595959}.drawer-menu .drawer-content .menu-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;padding:16px}.drawer-menu .drawer-content .menu-grid .menu-category{background:#fff;border:1px solid #f0f0f0;border-radius:8px;overflow:hidden;transition:all .2s ease}.dark-theme .drawer-menu .drawer-content .menu-grid .menu-category{background:#1f1f1f;border-color:#303030}.drawer-menu .drawer-content .menu-grid .menu-category:hover{box-shadow:0 2px 8px #00000014;transform:translateY(-2px)}.drawer-menu .drawer-content .menu-grid .menu-category .category-header{display:flex;align-items:center;gap:8px;padding:12px 16px;font-size:14px;font-weight:500;color:#333;cursor:pointer;background:#fafafa;border-bottom:1px solid #f0f0f0;transition:all .2s ease}.dark-theme .drawer-menu .drawer-content .menu-grid .menu-category .category-header{color:#e6e6e6;background:#262626;border-bottom-color:#303030}.drawer-menu .drawer-content .menu-grid .menu-category .category-header:hover{background:#f0f0f0;color:#1890ff}.dark-theme .drawer-menu .drawer-content .menu-grid .menu-category .category-header:hover{background:#303030;color:#1890ff}.drawer-menu .drawer-content .menu-grid .menu-category .category-items{padding:8px;display:flex;flex-direction:column;gap:4px}.drawer-menu .drawer-content .menu-grid .menu-category .category-items .menu-item{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:4px;cursor:pointer;transition:all .2s ease;color:#666;font-size:13px}.dark-theme .drawer-menu .drawer-content .menu-grid .menu-category .category-items .menu-item{color:#b3b3b3}.drawer-menu .drawer-content .menu-grid .menu-category .category-items .menu-item:hover{background:#f0f0f0;color:#1890ff}.dark-theme .drawer-menu .drawer-content .menu-grid .menu-category .category-items .menu-item:hover{background:#303030;color:#1890ff}.drawer-menu .drawer-content .menu-grid .menu-category .category-items .menu-item .item-title{font-size:13px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.drawer-menu .drawer-content .menu-grid .menu-category .category-items .submenu-items{margin-top:8px;padding-top:8px;border-top:1px dashed #f0f0f0}.dark-theme .drawer-menu .drawer-content .menu-grid .menu-category .category-items .submenu-items{border-top-color:#303030}.drawer-menu .drawer-content .menu-grid .menu-category .category-items .submenu-items .submenu-title{display:flex;align-items:center;padding:4px 8px;margin-bottom:4px;font-size:12px;font-weight:500;color:#999;background:#fafafa;border-radius:4px}.dark-theme .drawer-menu .drawer-content .menu-grid .menu-category .category-items .submenu-items .submenu-title{color:gray;background:#262626}.drawer-menu .drawer-content .menu-grid .menu-category .category-items .submenu-items .submenu-item{display:flex;align-items:center;gap:6px;padding:6px 8px 6px 16px;border-radius:4px;cursor:pointer;transition:all .2s ease;color:#666;font-size:12px}.dark-theme .drawer-menu .drawer-content .menu-grid .menu-category .category-items .submenu-items .submenu-item{color:#b3b3b3}.drawer-menu .drawer-content .menu-grid .menu-category .category-items .submenu-items .submenu-item:hover{background:#f0f0f0;color:#1890ff}.dark-theme .drawer-menu .drawer-content .menu-grid .menu-category .category-items .submenu-items .submenu-item:hover{background:#303030;color:#1890ff}.drawer-menu .drawer-content .menu-grid .menu-category .category-items .submenu-items .submenu-item .item-title{font-size:12px;font-weight:400}.main-content-area{flex:1;display:flex;flex-direction:column;overflow:hidden}.main-content-area .content-layout{flex:1;display:flex;flex-direction:column}.main-content-area .content-layout .main-content{flex:1;overflow:auto;background-color:var(--app-bg-content)}.main-content-area .content-layout .main-content .page-content{min-height:100%}@keyframes pulse-glow{0%,to{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.1)}}@media(max-width:1200px){.card-menu-area .card-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}.sidebar-menu{width:280px}}@media(max-width:768px){.card-menu-area{padding:20px}.card-menu-area .card-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}.card-menu-area .card-grid .menu-card{padding:20px;gap:16px}.card-menu-area .card-grid .menu-card .card-icon{width:60px;height:60px}.card-menu-area .card-grid .menu-card .card-icon .default-icon{font-size:24px}.card-menu-area .card-grid .menu-card .card-content .card-title{font-size:16px}.card-menu-area .card-grid .menu-card .card-content .card-description{font-size:13px}.sidebar-menu{width:100%;max-width:320px}.top-navbar{padding:0 16px}.top-navbar .navbar-left{gap:12px}.top-navbar .navbar-left .brand-name .brand-title{font-size:16px}.top-navbar .navbar-left .brand-name .brand-subtitle{display:none}}@media(max-width:480px){.card-menu-area{padding:16px}.card-menu-area .card-grid{grid-template-columns:1fr;gap:16px}.card-menu-area .card-grid .menu-card{padding:16px;gap:12px}.card-menu-area .card-grid .menu-card .card-icon{width:56px;height:56px}.card-menu-area .card-grid .menu-card .card-icon .default-icon{font-size:22px}.card-menu-area .card-grid .menu-card .card-content .card-title{font-size:15px}.card-menu-area .card-grid .menu-card .card-content .card-description{font-size:12px}.sidebar-menu{width:100%;max-width:none}.sidebar-menu .sidebar-header{padding:16px 20px}.sidebar-menu .sidebar-header .sidebar-title{font-size:15px}.sidebar-menu .sidebar-menu-tree{padding:12px 0}.sidebar-menu .sidebar-menu-tree :deep(.n-menu-item){margin:2px 12px;padding:8px 12px}.top-navbar{padding:0 12px}.top-navbar .navbar-left{gap:8px}.top-navbar .navbar-left .menu-toggle{width:36px;height:36px}.top-navbar .navbar-left .menu-toggle i{font-size:18px}.top-navbar .navbar-left .logo-container .logo-video{width:32px;height:32px}.top-navbar .navbar-left .navbar-divider{display:none}}.grid-icon[data-v-3e4915c5]{display:inline-grid;grid-template-columns:repeat(2,1fr);gap:2.5px;width:18px;height:18px;padding:1px}.grid-icon span[data-v-3e4915c5]{background-color:currentColor;border-radius:2px;opacity:.85}.hamburger-icon[data-v-3e4915c5]{display:inline-flex;flex-direction:column;justify-content:space-between;width:20px;height:16px;padding:2px 0}.hamburger-icon span[data-v-3e4915c5]{display:block;width:100%;height:2px;background-color:currentColor;border-radius:1px;opacity:.85;transition:all .2s ease}.settings-tabs[data-v-f98d8946] .n-tabs-nav{padding:0 4px}.settings-section[data-v-f98d8946]{margin-bottom:24px;padding-bottom:20px;border-bottom:1px solid var(--n-border-color)}.settings-section[data-v-f98d8946]:last-child{border-bottom:none}.section-title[data-v-f98d8946]{display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:600;margin-bottom:8px;color:var(--n-text-color)}.preset-grid[data-v-f98d8946]{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:12px}.preset-card[data-v-f98d8946]{position:relative;padding:18px 14px;border-radius:12px;border:2px solid var(--n-border-color);background:var(--n-color);cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);text-align:center;overflow:hidden}.preset-card[data-v-f98d8946]:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--n-color-target),var(--n-color-target));opacity:0;transition:opacity .3s ease;border-radius:3px 3px 0 0}.preset-card[data-v-f98d8946]:hover{border-color:var(--n-color-target);transform:translateY(-4px);box-shadow:0 8px 16px var(--primary-color-shadow, rgba(32, 128, 240, .12))}.preset-card[data-v-f98d8946]:hover:before{opacity:1}.preset-card:hover .preset-icon[data-v-f98d8946]{transform:scale(1.1)}.preset-card:hover .preset-name[data-v-f98d8946]{color:var(--n-color-target)}.preset-card.active[data-v-f98d8946]{border-color:var(--n-color-target);background:var(--n-color-target-light);box-shadow:0 8px 20px var(--primary-color-shadow, rgba(32, 128, 240, .2))}.preset-card.active[data-v-f98d8946]:before{opacity:1}.preset-card.active .preset-name[data-v-f98d8946]{color:var(--n-color-target);font-weight:600}.preset-icon[data-v-f98d8946]{font-size:36px;margin-bottom:10px;transition:all .3s ease}.preset-name[data-v-f98d8946]{font-size:14px;font-weight:500;margin-bottom:8px;color:var(--n-text-color);transition:all .3s ease}.preset-color[data-v-f98d8946]{display:flex;justify-content:center}.color-dot[data-v-f98d8946]{width:24px;height:24px;border-radius:50%;border:2px solid #fff;box-shadow:0 2px 8px #00000026;transition:all .3s ease}.color-dot[data-v-f98d8946]:hover{transform:scale(1.1);box-shadow:0 4px 12px #0003}.mode-group[data-v-f98d8946]{width:100%}.mode-group[data-v-f98d8946] .n-radio-button{flex:1}.color-picker-wrapper[data-v-f98d8946]{display:flex;align-items:center;gap:12px}.color-value[data-v-f98d8946]{width:80px;font-size:13px;font-family:Courier New,monospace;color:var(--n-text-color-2)}.radius-group[data-v-f98d8946],.transition-group[data-v-f98d8946]{width:100%}.radius-group[data-v-f98d8946] .n-radio-button,.transition-group[data-v-f98d8946] .n-radio-button{flex:1}.layout-grid[data-v-f98d8946]{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.layout-item[data-v-f98d8946]{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px 12px;border-radius:12px;border:2px solid var(--n-border-color);background:var(--n-color);cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);overflow:hidden}.layout-item[data-v-f98d8946]:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--n-color-target),var(--n-color-target));opacity:0;transition:opacity .3s ease;border-radius:3px 3px 0 0}.layout-item[data-v-f98d8946]:hover:not(.disabled){border-color:var(--n-color-target);box-shadow:0 8px 16px var(--primary-color-shadow, rgba(32, 128, 240, .12));transform:translateY(-4px)}.layout-item[data-v-f98d8946]:hover:not(.disabled):before{opacity:1}.layout-item:hover:not(.disabled) .layout-svg[data-v-f98d8946]{transform:scale(1.05);color:var(--n-color-target)}.layout-item:hover:not(.disabled) .layout-label[data-v-f98d8946]{color:var(--n-color-target)}.layout-item.active[data-v-f98d8946]{border-color:var(--n-color-target);background:var(--n-color-target-light);box-shadow:0 8px 20px var(--primary-color-shadow, rgba(32, 128, 240, .2))}.layout-item.active[data-v-f98d8946]:before{opacity:1}.layout-item.active .layout-svg[data-v-f98d8946]{color:var(--primary-color, #409eff)!important}.layout-item.active .layout-label[data-v-f98d8946]{color:var(--primary-color, #409eff)!important;font-weight:600}.layout-item.disabled[data-v-f98d8946]{cursor:not-allowed;opacity:.5;filter:grayscale(.8)}.layout-item.disabled[data-v-f98d8946]:hover{transform:none;box-shadow:none;border-color:var(--n-border-color)}.layout-item.disabled[data-v-f98d8946]:hover:before{opacity:0}.layout-screenshot[data-v-f98d8946]{width:100%;height:56px;display:flex;align-items:center;justify-content:center;background:var(--n-color-modal);border-radius:8px;padding:8px;transition:all .3s ease}.layout-svg[data-v-f98d8946]{width:64px;height:48px;color:#999;transition:all .3s ease}.layout-svg[data-v-f98d8946] rect{fill:currentColor!important}.layout-label[data-v-f98d8946]{font-size:13px;color:var(--n-text-color);font-weight:500;text-align:center;transition:all .3s ease;display:flex;flex-direction:column;align-items:center;gap:6px;line-height:1.4}.badge-soon[data-v-f98d8946]{font-size:10px;padding:1px 5px;border-radius:3px;background:linear-gradient(135deg,#faad14,#fa8c16);color:#fff;font-weight:600;white-space:nowrap;box-shadow:0 1px 3px #faad144d}.setting-item[data-v-f98d8946]{display:flex;justify-content:space-between;align-items:center;padding:10px 0;font-size:13px;color:var(--n-text-color)}.slider-item[data-v-f98d8946]{margin-bottom:20px}.slider-label[data-v-f98d8946]{display:flex;justify-content:space-between;margin-bottom:8px;font-size:13px;color:var(--n-text-color)}.slider-value[data-v-f98d8946]{font-weight:600;color:var(--n-color-target)}.action-buttons-grid[data-v-f98d8946]{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.setting-label[data-v-f98d8946]{display:flex;flex-direction:column;gap:4px}.setting-label .setting-desc[data-v-f98d8946]{font-size:12px;color:var(--n-text-color-2);opacity:.8}.system-info[data-v-f98d8946]{display:flex;flex-direction:column;gap:12px;margin-top:12px}.info-item[data-v-f98d8946]{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;background:var(--n-color);border-radius:8px;border:1px solid var(--n-border-color);transition:all .2s ease}.info-item[data-v-f98d8946]:hover{border-color:var(--n-color-target);background:var(--n-color-target-light)}.info-label[data-v-f98d8946]{font-size:13px;color:var(--n-text-color-2);font-weight:500}.info-value[data-v-f98d8946]{font-size:13px;color:var(--n-text-color);font-weight:600;font-family:Consolas,Monaco,monospace}.brand-logo[data-v-fd1c2eec]{display:flex;align-items:center;gap:10px;cursor:pointer;-webkit-user-select:none;user-select:none}.brand-logo--collapsed[data-v-fd1c2eec]{justify-content:center}.brand-logo__icon[data-v-fd1c2eec]{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0}.brand-logo__glow[data-v-fd1c2eec]{position:absolute;inset:-4px;border-radius:50%;background:radial-gradient(circle,rgba(99,102,241,.15) 0%,transparent 70%);pointer-events:none}.brand-logo__media[data-v-fd1c2eec]{border-radius:8px;object-fit:contain}.brand-logo__name[data-v-fd1c2eec]{display:flex;flex-direction:column;line-height:1.2;white-space:nowrap}.brand-logo__title[data-v-fd1c2eec]{font-size:15px;font-weight:700;background:linear-gradient(135deg,#667eea,#764ba2);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.brand-logo__subtitle[data-v-fd1c2eec]{font-size:10px;opacity:.6;letter-spacing:.5px}.brand-logo__divider[data-v-fd1c2eec]{width:1px;height:24px;margin:0 6px;background:linear-gradient(180deg,transparent 0%,rgba(128,128,128,.3) 50%,transparent 100%)}.icon-menu[data-v-f985d475]{display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 0;width:100%}.icon-menu__item[data-v-f985d475]{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:calc(100% - 12px);padding:10px 4px 8px;margin:0 6px;border-radius:10px;cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);position:relative;opacity:.7}.icon-menu__item[data-v-f985d475]:hover{opacity:1;background:#6366f114;transform:translateY(-1px)}.icon-menu__item--active[data-v-f985d475]{opacity:1;background:linear-gradient(135deg,#6366f126,#8b5cf61a);box-shadow:0 2px 8px #6366f133}.icon-menu__item--active[data-v-f985d475]:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:60%;border-radius:0 3px 3px 0;background:linear-gradient(180deg,#667eea,#764ba2)}.icon-menu__icon[data-v-f985d475]{display:flex;align-items:center;justify-content:center;width:28px;height:28px;font-size:20px}.icon-menu__fallback[data-v-f985d475]{font-size:14px;font-weight:600;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:8px;background:#8080801a}.icon-menu__label[data-v-f985d475]{font-size:11px;font-weight:500;line-height:1.2;text-align:center;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.floating-menu[data-v-0588c318]{position:absolute;top:0;left:100%;width:240px;height:100%;z-index:100;overflow-y:auto;border-right:1px solid rgba(128,128,128,.1);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.floating-menu.light-theme[data-v-0588c318]{background:#fffffff2;box-shadow:4px 0 24px #00000014}.floating-menu.dark-theme[data-v-0588c318]{background:#1e1e24f2;box-shadow:4px 0 24px #0000004d}.floating-menu__header[data-v-0588c318]{padding:16px 20px 12px;border-bottom:1px solid rgba(128,128,128,.1)}.floating-menu__brand-title[data-v-0588c318]{font-size:14px;font-weight:700;background:linear-gradient(135deg,#667eea,#764ba2);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.floating-menu__brand-subtitle[data-v-0588c318]{display:block;font-size:11px;opacity:.5;margin-top:2px}.floating-menu__list[data-v-0588c318]{padding:8px 12px}.floating-menu__group[data-v-0588c318]{margin-bottom:8px}.floating-menu__group-title[data-v-0588c318]{display:flex;align-items:center;gap:6px;padding:8px 8px 4px;font-size:12px;font-weight:600;opacity:.5;text-transform:uppercase;letter-spacing:.5px}.floating-menu__item[data-v-0588c318]{display:flex;align-items:center;gap:10px;padding:10px 12px;margin:2px 0;border-radius:8px;cursor:pointer;transition:all .2s ease;font-size:14px}.floating-menu__item[data-v-0588c318]:hover{background:#6366f114}.floating-menu__item.active[data-v-0588c318]{background:linear-gradient(135deg,#6366f11f,#8b5cf614);color:#667eea}.floating-menu__item--sub[data-v-0588c318]{padding-left:20px;font-size:13px}.floating-menu__item-text[data-v-0588c318]{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.slide-fade-enter-active[data-v-0588c318],.slide-fade-leave-active[data-v-0588c318]{transition:all .3s cubic-bezier(.4,0,.2,1)}.slide-fade-enter-from[data-v-0588c318],.slide-fade-leave-to[data-v-0588c318]{opacity:0;transform:translate(-12px)}.side-menu-toggle[data-v-1909f229]{position:absolute;right:0;top:50%;transform:translateY(-50%) translate(50%);width:24px;height:48px;display:flex;align-items:center;justify-content:center;border-radius:12px;cursor:pointer;z-index:10;transition:all .25s ease;font-size:14px}.side-menu-toggle.light-theme[data-v-1909f229]{background:#ffffffe6;box-shadow:0 2px 8px #0000001a}.side-menu-toggle.dark-theme[data-v-1909f229]{background:#28282ee6;box-shadow:0 2px 8px #0000004d}.side-menu-toggle[data-v-1909f229]:hover{transform:translateY(-50%) translate(50%) scale(1.1)}.side-menu[data-v-1909f229]{width:100%;height:100%;overflow-y:auto;padding:0 8px}.side-menu.light-theme[data-v-1909f229]{background:#fffffff2;border-left:1px solid rgba(0,0,0,.06)}.side-menu.dark-theme[data-v-1909f229]{background:#1e1e24f2;border-left:1px solid rgba(255,255,255,.06)}.side-menu__header[data-v-1909f229]{display:flex;align-items:center;gap:8px;padding:16px 12px 12px;border-bottom:1px solid rgba(128,128,128,.1);margin-bottom:8px}.side-menu__header-icon[data-v-1909f229]{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,#6366f11f,#8b5cf614)}.side-menu__header-title[data-v-1909f229]{font-size:14px;font-weight:600}.side-menu__list[data-v-1909f229]{padding:4px 0}.side-menu__group[data-v-1909f229]{margin-bottom:8px}.side-menu__group-label[data-v-1909f229]{display:flex;align-items:center;gap:6px;padding:6px 12px;font-size:12px;font-weight:600;opacity:.5}.side-menu__item[data-v-1909f229]{display:flex;align-items:center;gap:8px;padding:9px 12px;margin:2px 0;border-radius:8px;cursor:pointer;font-size:13px;transition:all .2s ease}.side-menu__item[data-v-1909f229]:hover{background:#6366f10f}.side-menu__item.active[data-v-1909f229]{background:linear-gradient(135deg,#6366f11a,#8b5cf60f);color:#667eea;font-weight:500}.side-menu__item-text[data-v-1909f229]{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.glass-slide-enter-active[data-v-1909f229],.glass-slide-leave-active[data-v-1909f229]{transition:all .35s cubic-bezier(.4,0,.2,1)}.glass-slide-enter-from[data-v-1909f229],.glass-slide-leave-to[data-v-1909f229]{opacity:0;transform:translate(20px)}.drawer-menu[data-v-b0d3e73b]{position:absolute;top:100%;left:0;right:0;z-index:100;max-height:60vh;overflow-y:auto;opacity:0;transform:translateY(-8px);pointer-events:none;transition:all .3s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom-left-radius:16px;border-bottom-right-radius:16px}.drawer-menu.visible[data-v-b0d3e73b]{opacity:1;transform:translateY(0);pointer-events:all}.drawer-menu.light-theme[data-v-b0d3e73b]{background:#fffffff5;box-shadow:0 8px 32px #0000001f;border:1px solid rgba(0,0,0,.06);border-top:none}.drawer-menu.dark-theme[data-v-b0d3e73b]{background:#1e1e24f5;box-shadow:0 8px 32px #0006;border:1px solid rgba(255,255,255,.06);border-top:none}.drawer-menu__header[data-v-b0d3e73b]{padding:16px 24px 8px}.drawer-menu__title[data-v-b0d3e73b]{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:600}.drawer-menu__content[data-v-b0d3e73b]{padding:8px 24px 20px}.drawer-menu__grid[data-v-b0d3e73b]{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}.drawer-menu__category[data-v-b0d3e73b]{padding:0}.drawer-menu__category-header[data-v-b0d3e73b]{display:flex;align-items:center;gap:8px;padding:8px 12px;font-size:14px;font-weight:600;cursor:pointer;border-radius:8px;transition:background .2s ease}.drawer-menu__category-header[data-v-b0d3e73b]:hover{background:#6366f10f}.drawer-menu__items[data-v-b0d3e73b]{padding-left:8px}.drawer-menu__item[data-v-b0d3e73b]{display:flex;align-items:center;gap:8px;padding:7px 12px;margin:1px 0;border-radius:6px;font-size:13px;cursor:pointer;transition:all .2s ease}.drawer-menu__item[data-v-b0d3e73b]:hover{background:#6366f114;color:#667eea}.drawer-menu__item--sub[data-v-b0d3e73b]{padding-left:16px;font-size:12px}.drawer-menu__item-text[data-v-b0d3e73b]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.drawer-menu__sub-items[data-v-b0d3e73b]{padding:4px 0}.drawer-menu__sub-title[data-v-b0d3e73b]{padding:4px 12px;font-size:11px;font-weight:600;opacity:.4}.grid-icon[data-v-b0d3e73b]{display:inline-grid;grid-template-columns:repeat(2,1fr);gap:2.5px;width:18px;height:18px;padding:1px}.grid-icon span[data-v-b0d3e73b]{background-color:currentColor;border-radius:2px;opacity:.85}.menu-trigger[data-v-2c20af78]{display:flex;align-items:center;justify-content:center;padding:0 8px;height:100%;cursor:pointer}.menu-trigger__indicator[data-v-2c20af78]{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:8px;font-size:18px;transition:all .25s ease;opacity:.6}.menu-trigger__indicator[data-v-2c20af78]:hover{opacity:1;background:#6366f114}.hamburger-icon[data-v-2c20af78]{display:inline-flex;flex-direction:column;justify-content:space-between;width:20px;height:16px;padding:2px 0}.hamburger-icon span[data-v-2c20af78]{display:block;width:100%;height:2px;background-color:currentColor;border-radius:1px;opacity:.85;transition:all .2s ease}
|
|
1
|
+
.layout-container{--menu-border-radius:10px;--menu-parent-gradient-start:#6366f11a;--menu-parent-gradient-end:#8b5cf60f;--menu-parent-border-color:#6366f173;--menu-parent-border-width:2px;--menu-parent-shadow:0 2px 6px #6366f11a, 0 4px 12px #6366f10f;--menu-selected-gradient-start:#6366f138;--menu-selected-gradient-end:#8b5cf629;--menu-selected-border-color:#6366f1bf;--menu-selected-border-width:3px;--menu-selected-shadow:0 2px 12px #6366f138, 0 4px 24px #6366f126;--menu-parent-blur:14px;--menu-parent-saturate:130%;--menu-selected-blur:16px;--menu-selected-saturate:135%;flex-direction:column;height:100vh;display:flex;overflow:hidden}.layout-container .content-with-header{height:calc(100vh - 150px);margin-top:100px}.layout-container .app-content{background-color:var(--app-bg-content)}.layout-container .n-layout-content{flex-direction:column;flex:1;display:flex;overflow-x:hidden}.main-content{border-radius:8px;flex:1;width:100%;padding:16px;overflow:hidden auto}[data-theme=light] .layout-container .light-theme,.layout-container .light-theme,[data-theme=dark] .layout-container .dark-theme,.layout-container .dark-theme{background-color:var(--app-bg-body)}.layout-container.light-mode .n-layout .n-layout-scroll-container{background-color:var(--app-bg-surface);border-radius:10px}.layout-container.dark-mode .n-layout .n-layout-scroll-container,.layout-container.system-mode .n-layout .n-layout-scroll-container{background-color:var(--app-bg-surface)}.layout-sider{backface-visibility:hidden;contain:layout style paint;transform:translateZ(0)}.layout-sider.light-theme,.layout-sider.dark-theme{background-color:var(--app-menu-bg)}.layout-sider .n-scrollbar-rail{width:0!important}.layout-sider .n-scrollbar-content{padding-right:0!important}.layout-container .n-layout-sider{flex-direction:column;flex-shrink:0;height:100%;display:flex;overflow:hidden}.menu-scroll-container{scrollbar-width:none;-ms-overflow-style:none;flex-direction:column;flex:1;height:calc(100vh - 56px);display:flex;overflow-y:scroll}.menu-scroll-container::-webkit-scrollbar{display:none}.layout-container .n-menu.n-menu--vertical{flex:1;min-height:min-content;overflow:hidden auto}.layout-container .n-menu-item-content__icon{vertical-align:middle;justify-content:center;align-items:center;margin-right:10px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;width:18px!important;height:18px!important;font-size:18px!important}.layout-container .n-menu-item-content__icon .n-icon{width:18px!important;height:18px!important;font-size:18px!important}.layout-container .n-menu-item-content__icon svg{width:18px!important;height:18px!important}.layout-container .n-menu-item-content-header{letter-spacing:.2px;font-size:14px;font-weight:500;line-height:1.5}.layout-container .n-menu-item-content__arrow{font-size:14px;transition:all .3s cubic-bezier(.4,0,.2,1)}.layout-container .n-menu-item{will-change:transform;border-radius:0;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:visible}.layout-container .n-menu-item:before{content:"";z-index:-1;background:linear-gradient(135deg,#ffffff14 0%,#ffffff0a 100%);border-radius:10px;transition:all .3s cubic-bezier(.4,0,.2,1);position:absolute;inset:0;box-shadow:0 2px 4px #00000014,inset 0 1px #ffffff1a}.layout-container .n-menu-item-content{border-radius:var(--menu-border-radius,10px);background:0 0;padding:10px 16px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative}.layout-container .n-menu-item-content:after{content:"";border-radius:var(--menu-border-radius,10px);pointer-events:none;border:1px solid #ffffff0f;border-left:2px solid #0000;transition:all .3s cubic-bezier(.4,0,.2,1);position:absolute;inset:0}.layout-container .n-menu-item:hover{transform:translate(2px)}.layout-container .n-menu-item:hover:before{background:#ffffff1a;border-radius:10px;box-shadow:0 4px 16px #0000001f,inset 0 1px #ffffff1f}.layout-container .n-menu-item:hover .n-menu-item-content{-webkit-backdrop-filter:blur(12px);border-radius:10px}.layout-container .n-menu-item:hover .n-menu-item-content:after{border-left-color:#6366f166;border-radius:10px;box-shadow:0 0 15px #6366f126,inset 0 1px 1px #ffffff1a}.layout-container .n-menu-item:hover .n-menu-item-content__icon{color:var(--n-item-icon-color-active-hover);transform:scale(1.08)}.layout-container .n-menu-item--selected,.layout-container .n-menu-item-content--selected{background:0 0!important}.layout-container .n-menu-item--selected:before,.layout-container .n-menu-item-content--selected:before{border-radius:var(--menu-border-radius,10px);box-shadow:var(--menu-selected-shadow,0 2px 12px #6366f138, 0 4px 24px #6366f126), inset 0 1px 2px #6366f11f, inset 0 0 0 1px #ffffff14;background:linear-gradient(135deg, var(--menu-selected-gradient-start,#6366f138) 0%, var(--menu-selected-gradient-end,#8b5cf629) 100%)!important}.layout-container .n-menu-item--selected .n-menu-item-content,.layout-container .n-menu-item-content--selected{-webkit-backdrop-filter:blur(var(--menu-selected-blur,16px)) saturate(var(--menu-selected-saturate,135%));background:0 0!important}.layout-container .n-menu-item--selected .n-menu-item-content:after,.layout-container .n-menu-item-content--selected:after{border-left:var(--menu-selected-border-width,3px) solid var(--menu-selected-border-color,#6366f1bf);border-radius:var(--menu-border-radius,10px);box-shadow:0 0 14px #6366f140,inset 0 1px 2px #ffffff1f}.layout-container .n-menu-item--selected .n-menu-item-content__icon{filter:drop-shadow(0 0 6px #6366f180);color:var(--n-item-icon-color-active);transform:scale(1.05)}.layout-container .n-menu-item:active{transform:scale(.98)}.layout-container .n-menu-item-content--child-active{background:0 0!important}.layout-container .n-menu-item-content--child-active:before{border-radius:var(--menu-border-radius,10px);box-shadow:var(--menu-parent-shadow,0 2px 6px #6366f11a, 0 4px 12px #6366f10f), inset 0 1px 2px #6366f10f, inset 0 0 0 1px #ffffff0d;background:linear-gradient(135deg, var(--menu-parent-gradient-start,#6366f11a) 0%, var(--menu-parent-gradient-end,#8b5cf60f) 100%)!important}.layout-container .n-menu-item-content--child-active:after{border-left:var(--menu-parent-border-width,2px) solid var(--menu-parent-border-color,#6366f173);border-radius:var(--menu-border-radius,10px)}.layout-container .n-menu-item-content--child-active{-webkit-backdrop-filter:blur(var(--menu-parent-blur,14px)) saturate(var(--menu-parent-saturate,130%))}.layout-container .n-menu>.n-menu-item,.layout-container .n-menu>.n-submenu{margin:4px 12px}.layout-container .n-submenu-children .n-menu-item{margin:4px 0}.layout-container .n-submenu-children .n-menu-item-content{padding-left:46px}.dark-theme{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}.dark-theme .layout-container .n-menu-item:before{background:linear-gradient(135deg,#ffffff14 0%,#ffffff0a 100%);box-shadow:0 2px 4px #0000001f,inset 0 1px #ffffff14}.dark-theme .layout-container .n-menu-item:hover:before{background:linear-gradient(135deg,#ffffff1f 0%,#ffffff14 100%)}.light-theme{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}.light-theme .layout-container .n-menu-item:before{background:linear-gradient(135deg,#fff9 0%,#fff6 100%);box-shadow:0 2px 4px #0000000a,inset 0 1px #fffc}.light-theme .layout-container .n-menu-item:hover:before{background:linear-gradient(135deg,#fffc 0%,#fff9 100%)}.light-theme .layout-container .n-menu-item-content:after{border-color:#00000014}.layout-container .n-menu.n-menu--collapsed{flex-direction:column;align-items:center;display:flex;width:64px!important}.layout-container .n-menu.n-menu--collapsed .n-menu-item-content{align-items:center;width:62px;display:flex;justify-content:center!important;padding:0!important}.layout-container .n-menu.n-menu--collapsed .n-icon{margin-top:4px!important;margin-left:40px!important}.layout-container .n-menu.n-menu--collapsed .n-menu-item{justify-content:center;width:100%;display:flex;padding:0!important}.layout-container .n-menu.n-menu--collapsed .n-menu-item-content-header{margin:-10px auto 0;padding:0}.layout-container .n-menu.n-menu--collapsed .n-menu-item-content__icon{margin-right:0}.layout-container .n-menu.n-menu--collapsed .n-menu-item-content--child-active .n-menu-item-content__icon{color:var(--n-item-color-active)!important}.layout-container .n-menu.n-menu--collapsed .n-menu-item-content--child-active{background:0 0!important}.layout-container .n-menu.n-menu--collapsed .n-menu-item-content--child-active:before{border-radius:var(--menu-border-radius,10px);box-shadow:var(--menu-selected-shadow,0 2px 12px #6366f138, 0 4px 24px #6366f126), inset 0 1px 2px #6366f11f, inset 0 0 0 1px #ffffff14;background:linear-gradient(135deg, var(--menu-selected-gradient-start,#6366f138) 0%, var(--menu-selected-gradient-end,#8b5cf629) 100%)!important}.layout-container .n-menu.n-menu--collapsed .n-menu-item-content--child-active{-webkit-backdrop-filter:blur(var(--menu-selected-blur,16px)) saturate(var(--menu-selected-saturate,135%))}.layout-container .n-menu.n-menu--collapsed .n-menu-item-content--child-active:after{border-radius:var(--menu-border-radius,10px);box-shadow:0 0 14px #6366f140,0 0 20px #6366f126}.layout-container .n-menu.n-menu--collapsed .n-menu-item:hover{transform:scale(1.05)}.layout-container .n-menu.n-menu--collapsed .n-menu-item:hover:before{background:#ffffff1a;box-shadow:0 4px 16px #00000026,inset 0 1px #ffffff26}.n-menu--collapsed .n-menu-item-content__icon{color:#e5e7ebe6!important}.layout-container .n-layout{width:100%;min-width:0}.no-horizontal-scroll{overflow-x:hidden!important}.layout-container .n-submenu{margin:4px 0}.layout-container .n-submenu>.n-menu-item-content{padding:10px 16px}.layout-container .n-submenu-children .n-menu-item{margin:2px 0;position:relative}.layout-container .n-submenu-children .n-menu-item:before{content:none}.layout-container .n-submenu-children .n-menu-item-content{padding:8px 16px 8px 46px;font-size:13px}.layout-container .n-submenu-children .n-menu-item-content__icon{margin-right:8px;width:16px!important;height:16px!important;font-size:16px!important}.layout-container .n-submenu-children .n-menu-item-content__icon .n-icon{width:16px!important;height:16px!important;font-size:16px!important}.layout-container .n-submenu-children .n-menu-item-content__icon svg{width:16px!important;height:16px!important}.layout-container .n-submenu-children .n-menu-item:hover{transform:translate(2px)}.layout-container .n-submenu-children{-webkit-backdrop-filter:blur(6px);background:#0000000d;border-left:2px solid #6366f14d;margin:2px 0;padding:4px 0}.layout-container .n-menu-item-group-title{text-transform:uppercase;letter-spacing:1.2px;opacity:.5;padding:12px 16px 6px;font-size:11px;font-weight:600;position:relative}.layout-container .n-menu-item-group-title:after{content:"";background:linear-gradient(90deg,#0000,#6366f133,#0000);height:1px;position:absolute;bottom:0;left:16px;right:16px}.layout-container .n-menu-divider{-webkit-backdrop-filter:blur(4px);background:linear-gradient(90deg,#0000,#ffffff1a,#0000);height:1px;margin:8px 16px}.layout-container .n-menu-item.n-menu-item--loading:before{background:linear-gradient(90deg,#6366f11a 0%,#8b5cf633 50%,#6366f11a 100%) 0 0/200% 100%;animation:2s infinite shimmer}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.layout-container .n-menu-item.n-menu-item--disabled{opacity:.4;filter:grayscale(.5);cursor:not-allowed}.layout-container .n-menu-item.n-menu-item--disabled:before{background:#ffffff03}.layout-container .n-menu-item.n-menu-item--disabled:hover{transform:none}.fade-zoom-enter-from,.fade-zoom-leave-to{opacity:0;transform:scale(.8)}.layout-coming-soon{background-color:var(--app-bg-content);justify-content:center;align-items:center;height:100vh;display:flex}.coming-soon-content{text-align:center;background-color:var(--app-bg-surface);border-radius:12px;max-width:400px;padding:40px;box-shadow:0 8px 24px #0000001a}.coming-soon-icon{margin-bottom:16px;font-size:64px}.coming-soon-title{color:var(--app-text-primary);margin-bottom:8px;font-size:24px;font-weight:600}.coming-soon-desc{color:var(--app-text-secondary);font-size:16px;line-height:1.5}.top-layout-container{background-color:var(--app-bg-body);flex-direction:column;height:100vh;display:flex;overflow:hidden}.top-navbar{-webkit-backdrop-filter:blur(20px)saturate(180%);z-index:1000;background:linear-gradient(135deg,#fffffff2 0%,#fffffffa 100%);border-bottom:1px solid #0000000f;align-items:center;height:64px;padding:0 24px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;box-shadow:0 2px 8px #00000008,0 1px 2px #00000005}.navbar-left{flex-shrink:0;align-items:center;gap:16px;display:flex}.logo-container{justify-content:center;align-items:center;width:40px;height:40px;display:flex;position:relative}.logo-glow{filter:blur(8px);background:radial-gradient(circle,#6366f140 0%,#0000 70%);border-radius:8px;animation:3s ease-in-out infinite pulse-glow;position:absolute;inset:0}@keyframes pulse-glow{0%,to{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.1)}}.logo-video{z-index:10;border-radius:8px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;box-shadow:0 4px 12px #6366f133,0 2px 4px #0000001a}.logo-video:hover{transform:scale(1.05)rotate(2deg);box-shadow:0 6px 16px #6366f14d,0 3px 6px #00000026}.brand-name{flex-direction:column;gap:2px;display:flex}.brand-title{background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%);-webkit-text-fill-color:transparent;letter-spacing:.5px;-webkit-background-clip:text;background-clip:text;font-size:18px;font-weight:700;line-height:1}.brand-subtitle{color:var(--app-text-tertiary);letter-spacing:2px;opacity:.7;font-size:11px;font-weight:500;line-height:1}.navbar-divider{background:linear-gradient(#0000,#6366f14d 50%,#0000);width:1px;height:24px;margin:0 8px}.navbar-center{flex:1;align-items:center;min-width:0;padding:0 24px;display:flex}.navbar-center :deep(.n-menu){background:0 0!important}.navbar-center :deep(.n-menu-item){margin:0 4px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative}.navbar-center :deep(.n-menu-item--selected):after{content:"";background:linear-gradient(90deg,#6366f1 0%,#8b5cf6 100%);border-radius:2px 2px 0 0;width:24px;height:3px;position:absolute;bottom:0;left:50%;transform:translate(-50%);box-shadow:0 -2px 8px #6366f14d}.navbar-center :deep(.n-menu-item-content__icon){margin-right:8px;font-size:18px!important}.navbar-center :deep(.n-menu-item--selected .n-menu-item-content__icon){filter:drop-shadow(0 0 4px #6366f166)}.navbar-center :deep(.n-submenu){margin:0 4px}.navbar-center :deep(.n-submenu-children){-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#fffffffa;border:1px solid #0000000f;border-radius:12px;margin-top:8px;padding:8px;box-shadow:0 8px 24px #00000014,0 2px 8px #0000000a}.main-content{background-color:var(--app-bg-content);flex-direction:column;flex:1;display:flex;overflow:hidden}.page-content{flex:1;padding:24px;overflow:hidden auto}.page-content::-webkit-scrollbar{width:8px;height:8px}.page-content::-webkit-scrollbar-track{background:0 0}.page-content::-webkit-scrollbar-thumb{background:#0000001a;border-radius:4px;transition:background .3s}.page-content::-webkit-scrollbar-thumb:hover{background:#0003}.dark-theme .page-content::-webkit-scrollbar-thumb{background:#ffffff1a}.dark-theme .page-content::-webkit-scrollbar-thumb:hover{background:#fff3}@media (width<=1200px){.navbar-center{padding:0 16px}.brand-subtitle{display:none}}@media (width<=768px){.top-navbar{padding:0 16px}.navbar-divider{display:none}.action-buttons{gap:4px}.page-content{padding:0 16px 16px}}.dark-theme .navbar-center :deep(.n-submenu-children){background:#1c1c21fa;border-color:#ffffff14;box-shadow:0 8px 24px #0000004d,0 2px 8px #0003}.dark-theme .brand-subtitle{color:#ffffff80}.dark-theme .action-btn span{color:#ffffffb3}.dark-theme .action-btn:hover span{color:#8b5cf6}.dark-theme .user-dropdown{color:#ffffffe6}.fade-slide-enter-active,.fade-slide-leave-active{transition:all .3s cubic-bezier(.4,0,.2,1)}.fade-slide-enter-from{opacity:0;transform:translateY(20px)}.fade-slide-leave-to{opacity:0;transform:translateY(-20px)}.fade-transform-enter-active,.fade-transform-leave-active{transition:all .3s cubic-bezier(.4,0,.2,1)}.fade-transform-enter-from{opacity:0;transform:scale(.95)}.fade-transform-leave-to{opacity:0;transform:scale(1.05)}.fade-zoom-enter-active,.fade-zoom-leave-active{transition:all .3s cubic-bezier(.4,0,.2,1)}.fade-zoom-enter-from,.fade-zoom-leave-to{opacity:0;transform:scale(.8)}.responsive-menu[data-v-d329131b]{align-items:center;gap:0;width:100%;display:flex}.responsive-menu__visible[data-v-d329131b]{flex:0 auto;min-width:0;overflow:hidden}.responsive-menu__visible[data-v-d329131b] .n-menu{background-color:#0000!important}.responsive-menu__visible[data-v-d329131b] .n-menu-item{letter-spacing:.01em;font-weight:500;transition:all .25s cubic-bezier(.4,0,.2,1);position:relative}.responsive-menu__visible[data-v-d329131b] .n-menu-item-content-header{text-overflow:clip!important;white-space:nowrap!important;overflow:visible!important}.responsive-menu__visible[data-v-d329131b] .n-menu-item-content{overflow:visible!important}.responsive-menu__visible[data-v-d329131b] .n-menu-item:after{content:"";opacity:0;background:linear-gradient(90deg,#0000,currentColor,#0000);width:60%;height:2px;transition:all .3s cubic-bezier(.4,0,.2,1);position:absolute;bottom:0;left:50%;transform:translate(-50%)scaleX(0)}.responsive-menu__visible[data-v-d329131b] .n-menu-item.n-menu-item--selected:after{opacity:.5;transform:translate(-50%)scaleX(1)}.responsive-menu__visible[data-v-d329131b] .n-menu-item:hover{transform:translateY(-1px)}.responsive-menu__visible[data-v-d329131b] .n-menu-item.n-menu-item--selected{box-shadow:0 2px 8px -2px #1e40af26,0 1px 3px #1e40af1a}.responsive-menu__more[data-v-d329131b]{flex-shrink:0;margin-left:4px}.responsive-menu__more-btn[data-v-d329131b]{min-width:42px;height:42px;transition:all .25s cubic-bezier(.4,0,.2,1);background-color:#0000!important;border-radius:10px!important;padding:0 18px!important}.responsive-menu__more-btn[data-v-d329131b]:before,.responsive-menu__more-btn[data-v-d329131b] .n-button__border,.responsive-menu__more-btn[data-v-d329131b] .n-button__state-border{display:none!important}.responsive-menu__more-btn[data-v-d329131b]:hover{transform:translateY(-1px);background-color:#1e40af0f!important}.dots-icon[data-v-d329131b]{justify-content:center;align-items:center;gap:3px;width:20px;height:20px;display:inline-flex}.dots-icon span[data-v-d329131b]{opacity:.85;background-color:currentColor;border-radius:50%;width:4px;height:4px}.mix-layout-container{width:100%;height:100vh;display:flex;overflow:hidden}.first-level-menu{z-index:1000;flex-direction:column;align-items:center;width:80px;height:100vh;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.first-level-menu.light-theme{-webkit-backdrop-filter:blur(20px)saturate(180%);background:linear-gradient(#fffffff2 0%,#fffffffa 100%);border-right:1px solid #0000000f;box-shadow:2px 0 8px #00000008,1px 0 2px #00000005}.first-level-menu.light-theme:before{content:"";background:linear-gradient(#0000,#6366f133 50%,#0000);width:1px;position:absolute;top:0;bottom:0;right:0}.first-level-menu.dark-theme{-webkit-backdrop-filter:blur(20px)saturate(180%);background:linear-gradient(#1c1c21f2 0%,#1c1c21fa 100%);border-right:1px solid #ffffff14;box-shadow:2px 0 8px #0003,1px 0 2px #0000001a}.first-level-menu.dark-theme:before{content:"";background:linear-gradient(#0000,#6366f14d 50%,#0000);width:1px;position:absolute;top:0;bottom:0;right:0}.first-level-menu .logo-container{border-bottom:1px solid #5e5c5c14;flex-shrink:0;justify-content:center;align-items:center;width:100%;height:80px;display:flex;position:relative}.light-theme .first-level-menu .logo-container{border-bottom-color:#0000000f}.dark-theme .first-level-menu .logo-container{border-bottom-color:#ffffff14}.first-level-menu .logo-glow{filter:blur(12px);background:radial-gradient(circle,#6366f140 0%,#0000 70%);border-radius:12px;animation:3s ease-in-out infinite pulse-glow;position:absolute;inset:0}.first-level-menu .logo-video{z-index:10;border-radius:10px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;box-shadow:0 4px 12px #6366f133,0 2px 4px #0000001a}.first-level-menu .logo-video:hover{transform:scale(1.05)rotate(2deg);box-shadow:0 6px 16px #6366f14d,0 3px 6px #00000026}.first-level-menu .first-menu-list{flex:1;width:100%;padding:0 0 16px;overflow:hidden auto}.first-level-menu .first-menu-list::-webkit-scrollbar{width:0;display:none}.first-level-menu .first-menu-item{cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:6px;width:100%;height:72px;margin-bottom:8px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.first-level-menu .first-menu-item .menu-item-content{border:1px solid #0000;border-radius:10px;justify-content:center;align-items:center;width:36px;height:36px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.first-level-menu .first-menu-item .menu-item-label{text-overflow:ellipsis;white-space:nowrap;opacity:.7;letter-spacing:.3px;max-width:64px;font-size:11px;font-weight:500;line-height:1;transition:all .3s cubic-bezier(.4,0,.2,1);overflow:hidden}.first-level-menu .first-menu-item .menu-item-text{font-size:18px;font-weight:600;line-height:1}.first-level-menu.light-theme .first-menu-item .menu-item-content{color:#000000a6}.first-level-menu.light-theme .first-menu-item .menu-item-label{color:#000000d9}.first-level-menu.light-theme .first-menu-item:hover .menu-item-content{-webkit-backdrop-filter:blur(10px)saturate(150%);color:#2080f0;background:linear-gradient(135deg,#ffffffe6 0%,#fffc 100%);border:1px solid #2080f033;transform:translateY(-2px);box-shadow:0 4px 12px #2080f01a,0 2px 4px #0000000d,inset 0 1px #fffc}.first-level-menu.light-theme .first-menu-item:hover .menu-item-label{color:#2080f0;opacity:1}.first-level-menu.light-theme .first-menu-item.active .menu-item-content{-webkit-backdrop-filter:blur(10px)saturate(150%);background:linear-gradient(135deg,#2080f026 0%,#4098fc1f 100%);border:1px solid #2080f04d;box-shadow:0 4px 16px #2080f033,0 2px 8px #2080f01a,inset 0 1px #fff9,inset 0 -1px #2080f01a;color:#2080f0!important}.first-level-menu.light-theme .first-menu-item.active .menu-item-label{opacity:1;font-weight:600;color:#2080f0!important}.first-level-menu.light-theme .first-menu-item.active:before{content:"";background:linear-gradient(#2080f0 0%,#4098fc 100%);border-radius:0 2px 2px 0;width:3px;height:28px;position:absolute;top:50%;left:0;transform:translateY(-50%);box-shadow:2px 0 8px #2080f080,0 0 12px #2080f04d}.first-level-menu.dark-theme .first-menu-item .menu-item-content{color:#ffffffa6}.first-level-menu.dark-theme .first-menu-item .menu-item-label{color:#ffffffd9}.first-level-menu.dark-theme .first-menu-item:hover .menu-item-content{-webkit-backdrop-filter:blur(10px)saturate(150%);color:#4098fc;background:linear-gradient(135deg,#ffffff1f 0%,#ffffff14 100%);border:1px solid #4098fc40;transform:translateY(-2px);box-shadow:0 4px 12px #2080f026,0 2px 4px #0000001a,inset 0 1px #ffffff26}.first-level-menu.dark-theme .first-menu-item:hover .menu-item-label{color:#4098fc;opacity:1}.first-level-menu.dark-theme .first-menu-item.active .menu-item-content{-webkit-backdrop-filter:blur(10px)saturate(150%);background:linear-gradient(135deg,#2080f040 0%,#4098fc2e 100%);border:1px solid #4098fc59;box-shadow:0 4px 16px #2080f040,0 2px 8px #2080f026,inset 0 1px #fff3,inset 0 -1px #2080f033;color:#4098fc!important}.first-level-menu.dark-theme .first-menu-item.active .menu-item-label{opacity:1;font-weight:600;color:#4098fc!important}.first-level-menu.dark-theme .first-menu-item.active:before{content:"";background:linear-gradient(#2080f0 0%,#4098fc 100%);border-radius:0 2px 2px 0;width:3px;height:28px;position:absolute;top:50%;left:0;transform:translateY(-50%);box-shadow:2px 0 8px #2080f099,0 0 12px #2080f066}.second-level-menu-popup{z-index:1001;flex-direction:column;width:220px;height:100vh;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;top:0;left:80px}.second-level-menu-popup.light-theme{-webkit-backdrop-filter:blur(20px)saturate(180%);background:#fffffffa;border-right:1px solid #0000000f;box-shadow:2px 0 24px #00000014,1px 0 8px #0000000a}.second-level-menu-popup.dark-theme{-webkit-backdrop-filter:blur(20px)saturate(180%);background:#1c1c21fa;border-right:1px solid #ffffff14;box-shadow:2px 0 24px #0000004d,1px 0 8px #0003}.second-level-menu-popup .second-menu-header{border-bottom:1px solid #5e5c5c14;flex-shrink:0;justify-content:center;align-items:center;height:80px;padding:0 20px;display:flex}.light-theme .second-level-menu-popup .second-menu-header{border-bottom-color:#0000000f}.dark-theme .second-level-menu-popup .second-menu-header{border-bottom-color:#ffffff14}.second-level-menu-popup .second-menu-header .brand-info{flex-direction:column;align-items:center;gap:4px;display:flex}.second-level-menu-popup .second-menu-header .brand-title{background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%);-webkit-text-fill-color:transparent;letter-spacing:.5px;-webkit-background-clip:text;background-clip:text;font-size:16px;font-weight:700;line-height:1}.second-level-menu-popup .second-menu-header .brand-subtitle{letter-spacing:1px;opacity:.6;font-size:11px;font-weight:500;line-height:1}.light-theme .second-level-menu-popup .second-menu-header .brand-subtitle{color:#00000073}.dark-theme .second-level-menu-popup .second-menu-header .brand-subtitle{color:#ffffff73}.second-level-menu-popup .second-menu-list{flex:1;padding:12px;overflow:hidden auto}.second-level-menu-popup .second-menu-list::-webkit-scrollbar{width:6px}.second-level-menu-popup .second-menu-list::-webkit-scrollbar-track{background:0 0}.second-level-menu-popup .second-menu-list::-webkit-scrollbar-thumb{border-radius:3px;transition:background .3s}.light-theme .second-level-menu-popup .second-menu-list::-webkit-scrollbar-thumb{background:#0000001a}.light-theme .second-level-menu-popup .second-menu-list::-webkit-scrollbar-thumb:hover{background:#0003}.dark-theme .second-level-menu-popup .second-menu-list::-webkit-scrollbar-thumb{background:#ffffff1a}.dark-theme .second-level-menu-popup .second-menu-list::-webkit-scrollbar-thumb:hover{background:#fff3}.second-level-menu-popup .second-menu-group{margin-bottom:12px}.second-level-menu-popup .second-menu-group .group-title{text-transform:uppercase;letter-spacing:.5px;opacity:.6;align-items:center;gap:8px;padding:8px 16px;font-size:12px;font-weight:600;display:flex}.light-theme .second-level-menu-popup .second-menu-group .group-title{color:#00000073}.dark-theme .second-level-menu-popup .second-menu-group .group-title{color:#ffffff73}.light-theme .second-level-menu-popup .second-menu-group .group-title .menu-icon{color:#00000073!important}.dark-theme .second-level-menu-popup .second-menu-group .group-title .menu-icon{color:#ffffff73!important}.light-theme .second-level-menu-popup .second-menu-group .group-title .menu-text{color:#00000073!important}.dark-theme .second-level-menu-popup .second-menu-group .group-title .menu-text{color:#ffffff73!important}.second-level-menu-popup .second-menu-item{cursor:pointer;border-radius:10px;align-items:center;gap:12px;margin-bottom:6px;padding:14px 16px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.second-level-menu-popup .second-menu-item.sub-item{padding-left:32px;font-size:13px}.second-level-menu-popup .second-menu-item .item-title{text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:14px;font-weight:500;transition:color .3s;overflow:hidden}.second-level-menu-popup.light-theme .second-menu-item{color:#000000a6}.second-level-menu-popup.light-theme .second-menu-item:hover{color:#6366f1;background:#6366f114;transform:translate(4px);box-shadow:0 2px 8px #6366f11a}:is(.second-level-menu-popup.light-theme .second-menu-item:hover :deep(.c-icon),.second-level-menu-popup.light-theme .second-menu-item:hover .item-title){color:#6366f1!important}.second-level-menu-popup.light-theme .second-menu-item.active{color:#6366f1!important;background:linear-gradient(135deg,#6366f11f 0%,#8b5cf614 100%)!important;font-weight:600!important;box-shadow:0 2px 8px #6366f126,inset 0 1px #ffffff1a!important}.second-level-menu-popup.light-theme .second-menu-item.active :deep(.c-icon){color:#6366f1!important;filter:drop-shadow(0 0 4px #6366f166)!important}.second-level-menu-popup.light-theme .second-menu-item.active .item-title{color:#6366f1!important}.second-level-menu-popup.light-theme .second-menu-item.active:before{content:""!important;background:linear-gradient(#6366f1 0%,#8b5cf6 100%)!important;border-radius:0 2px 2px 0!important;width:3px!important;height:20px!important;position:absolute!important;top:50%!important;left:0!important;transform:translateY(-50%)!important;box-shadow:2px 0 8px #6366f14d!important}.second-level-menu-popup.dark-theme .second-menu-item{color:#ffffffa6}.second-level-menu-popup.dark-theme .second-menu-item:hover{color:#8b5cf6;background:#6366f126;transform:translate(4px);box-shadow:0 2px 8px #8b5cf626}:is(.second-level-menu-popup.dark-theme .second-menu-item:hover :deep(.c-icon),.second-level-menu-popup.dark-theme .second-menu-item:hover .item-title){color:#8b5cf6!important}.second-level-menu-popup.dark-theme .second-menu-item.active{color:#8b5cf6!important;background:linear-gradient(135deg,#6366f133 0%,#8b5cf626 100%)!important;font-weight:600!important;box-shadow:0 2px 8px #8b5cf633,inset 0 1px #ffffff0d!important}.second-level-menu-popup.dark-theme .second-menu-item.active :deep(.c-icon){color:#8b5cf6!important;filter:drop-shadow(0 0 4px #8b5cf666)!important}.second-level-menu-popup.dark-theme .second-menu-item.active .item-title{color:#8b5cf6!important}.second-level-menu-popup.dark-theme .second-menu-item.active:before{content:""!important;background:linear-gradient(#6366f1 0%,#8b5cf6 100%)!important;border-radius:0 2px 2px 0!important;width:3px!important;height:20px!important;position:absolute!important;top:50%!important;left:0!important;transform:translateY(-50%)!important;box-shadow:2px 0 8px #6366f14d!important}.slide-fade-enter-active{transition:all .25s cubic-bezier(.4,0,.2,1)}.slide-fade-leave-active{transition:all .2s cubic-bezier(.4,0,1,1)}.slide-fade-enter-from,.slide-fade-leave-to{opacity:0;transform:translate(-20px)}.main-layout{flex-direction:column;flex:1;display:flex;overflow:hidden}@media (width<=768px){.first-level-menu{width:64px}.first-level-menu .logo-container{height:64px}.first-level-menu .logo-container .logo-video{width:32px;height:32px}.first-level-menu .first-menu-item{height:60px}.first-level-menu .first-menu-item .menu-item-content{width:40px;height:40px}.first-level-menu .first-menu-item .menu-item-label{font-size:11px}.second-level-menu-popup{width:200px;left:64px}.second-level-menu-popup .second-menu-header{height:64px;padding:0 16px}.second-level-menu-popup .second-menu-header .menu-title{font-size:15px}}.mix-top-layout-container{flex-direction:row;width:100%;height:100vh;display:flex;overflow:hidden}.top-navbar{z-index:1000;align-items:center;height:64px;padding:0 24px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.top-navbar.light-theme{-webkit-backdrop-filter:blur(20px)saturate(180%);background:linear-gradient(135deg,#fffffff2 0%,#fffffffa 100%);border-bottom:1px solid #0000000f;box-shadow:0 2px 8px #00000008,0 1px 2px #00000005}.top-navbar.light-theme:before{content:"";background:linear-gradient(90deg,#0000,#6366f133 50%,#0000);height:1px;position:absolute;top:0;left:0;right:0}.top-navbar.dark-theme{-webkit-backdrop-filter:blur(20px)saturate(180%);background:linear-gradient(135deg,#1c1c21f2 0%,#1c1c21fa 100%);border-bottom:1px solid #ffffff14;box-shadow:0 2px 8px #0003,0 1px 2px #0000001a}.top-navbar.dark-theme:before{content:"";background:linear-gradient(90deg,#0000,#6366f14d 50%,#0000);height:1px;position:absolute;top:0;left:0;right:0}.top-navbar .logo-container{justify-content:center;align-items:center;width:40px;height:40px;display:flex;position:relative}.top-navbar .logo-glow{filter:blur(8px);background:radial-gradient(circle,#6366f140 0%,#0000 70%);border-radius:8px;animation:3s ease-in-out infinite pulse-glow;position:absolute;inset:0}.top-navbar .logo-video{z-index:10;border-radius:8px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;box-shadow:0 4px 12px #6366f133,0 2px 4px #0000001a}.top-navbar .logo-video:hover{transform:scale(1.05)rotate(2deg);box-shadow:0 6px 16px #6366f14d,0 3px 6px #00000026}.top-navbar .brand-name{flex-direction:column;gap:2px;display:flex}.top-navbar .brand-title{background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%);-webkit-text-fill-color:transparent;letter-spacing:.5px;-webkit-background-clip:text;background-clip:text;font-size:18px;font-weight:700;line-height:1}.top-navbar .brand-subtitle{letter-spacing:2px;opacity:.7;font-size:11px;font-weight:500;line-height:1}.light-theme .top-navbar .brand-subtitle{color:#00000073}.dark-theme .top-navbar .brand-subtitle{color:#ffffff80}.top-navbar .navbar-divider{background:linear-gradient(#0000,#6366f14d 50%,#0000);width:1px;height:24px;margin:0 8px}.top-navbar .navbar-center{flex:1;align-items:center;min-width:0;padding:0 24px;display:flex}.top-navbar .navbar-center :deep(.n-menu){background-color:#0000!important}.top-navbar .navbar-center :deep(.n-menu-item){margin:0 4px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative}.top-navbar .navbar-center :deep(.n-menu-item--selected):after{content:"";background:linear-gradient(90deg,#6366f1 0%,#8b5cf6 100%);border-radius:2px 2px 0 0;width:24px;height:3px;position:absolute;bottom:0;left:50%;transform:translate(-50%);box-shadow:0 -2px 8px #6366f14d}.top-navbar .navbar-center :deep(.n-menu-item-content__icon){margin-right:8px;font-size:18px!important}.top-navbar .navbar-center :deep(.n-menu-item--selected .n-menu-item-content__icon){filter:drop-shadow(0 0 4px #6366f166)}.top-navbar .navbar-center :deep(.n-submenu){margin:0 4px}.top-navbar .navbar-center :deep(.n-submenu-children){-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#fffffffa;border:1px solid #0000000f;border-radius:12px;margin-top:8px;padding:8px;box-shadow:0 8px 24px #00000014,0 2px 8px #0000000a}.top-navbar.dark-theme .navbar-center :deep(.n-submenu-children){background:#1c1c21fa;border-color:#ffffff14;box-shadow:0 8px 24px #0000004d,0 2px 8px #0003}.first-level-sidebar{z-index:999;flex-direction:column;align-items:center;width:80px;height:100%;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.first-level-sidebar.light-theme{-webkit-backdrop-filter:blur(20px)saturate(180%);background:linear-gradient(#fffffff2 0%,#fffffffa 100%);border-right:1px solid #0000000f;box-shadow:2px 0 8px #00000008,1px 0 2px #00000005}.first-level-sidebar.light-theme:before{content:"";background:linear-gradient(#0000,#6366f133 50%,#0000);width:1px;position:absolute;top:0;bottom:0;right:0}.first-level-sidebar.dark-theme{-webkit-backdrop-filter:blur(20px)saturate(180%);background:linear-gradient(#1c1c21f2 0%,#1c1c21fa 100%);border-right:1px solid #ffffff14;box-shadow:2px 0 8px #0003,1px 0 2px #0000001a}.first-level-sidebar.dark-theme:before{content:"";background:linear-gradient(#0000,#6366f14d 50%,#0000);width:1px;position:absolute;top:0;bottom:0;right:0}.first-level-sidebar .logo-container{border-bottom:1px solid #5e5c5c14;flex-shrink:0;justify-content:center;align-items:center;width:100%;height:80px;display:flex;position:relative}.light-theme .first-level-sidebar .logo-container{border-bottom-color:#0000000f}.dark-theme .first-level-sidebar .logo-container{border-bottom-color:#ffffff14}.first-level-sidebar .logo-glow{filter:blur(12px);background:radial-gradient(circle,#6366f140 0%,#0000 70%);border-radius:12px;animation:3s ease-in-out infinite pulse-glow;position:absolute;inset:0}.first-level-sidebar .logo-video{z-index:10;border-radius:10px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;box-shadow:0 4px 12px #6366f133,0 2px 4px #0000001a}.first-level-sidebar .logo-video:hover{transform:scale(1.05)rotate(2deg);box-shadow:0 6px 16px #6366f14d,0 3px 6px #00000026}.first-level-sidebar .first-menu-list{flex:1;width:100%;padding:0 0 16px;overflow:hidden auto}.first-level-sidebar .first-menu-list::-webkit-scrollbar{width:0;display:none}.first-level-sidebar .first-menu-item{cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:6px;width:100%;height:72px;margin-bottom:8px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.first-level-sidebar .first-menu-item .menu-item-content{border:1px solid #0000;border-radius:10px;justify-content:center;align-items:center;width:36px;height:36px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.first-level-sidebar .first-menu-item .menu-item-label{text-overflow:ellipsis;white-space:nowrap;opacity:.7;letter-spacing:.3px;max-width:64px;font-size:11px;font-weight:500;line-height:1;transition:all .3s cubic-bezier(.4,0,.2,1);overflow:hidden}.first-level-sidebar .first-menu-item .menu-item-text{font-size:18px;font-weight:600;line-height:1}.first-level-sidebar.light-theme .first-menu-item .menu-item-content{color:#000000a6}.first-level-sidebar.light-theme .first-menu-item .menu-item-label{color:#000000d9}.first-level-sidebar.light-theme .first-menu-item:hover .menu-item-content{-webkit-backdrop-filter:blur(10px)saturate(150%);color:#2080f0;background:linear-gradient(135deg,#ffffffe6 0%,#fffc 100%);border:1px solid #2080f033;transform:translateY(-2px);box-shadow:0 4px 12px #2080f01a,0 2px 4px #0000000d,inset 0 1px #fffc}.first-level-sidebar.light-theme .first-menu-item:hover .menu-item-label{color:#2080f0;opacity:1}.first-level-sidebar.light-theme .first-menu-item.active .menu-item-content{-webkit-backdrop-filter:blur(10px)saturate(150%);background:linear-gradient(135deg,#2080f026 0%,#4098fc1f 100%);border:1px solid #2080f04d;box-shadow:0 4px 16px #2080f033,0 2px 8px #2080f01a,inset 0 1px #fff9,inset 0 -1px #2080f01a;color:#2080f0!important}.first-level-sidebar.light-theme .first-menu-item.active .menu-item-label{opacity:1;font-weight:600;color:#2080f0!important}.first-level-sidebar.light-theme .first-menu-item.active:before{content:"";background:linear-gradient(#2080f0 0%,#4098fc 100%);border-radius:0 2px 2px 0;width:3px;height:28px;position:absolute;top:50%;left:0;transform:translateY(-50%);box-shadow:2px 0 8px #2080f080,0 0 12px #2080f04d}.first-level-sidebar.dark-theme .first-menu-item .menu-item-content{color:#ffffffa6}.first-level-sidebar.dark-theme .first-menu-item .menu-item-label{color:#ffffffd9}.first-level-sidebar.dark-theme .first-menu-item:hover .menu-item-content{-webkit-backdrop-filter:blur(10px)saturate(150%);color:#4098fc;background:linear-gradient(135deg,#ffffff1f 0%,#ffffff14 100%);border:1px solid #4098fc40;transform:translateY(-2px);box-shadow:0 4px 12px #2080f026,0 2px 4px #0000001a,inset 0 1px #ffffff26}.first-level-sidebar.dark-theme .first-menu-item:hover .menu-item-label{color:#4098fc;opacity:1}.first-level-sidebar.dark-theme .first-menu-item.active .menu-item-content{-webkit-backdrop-filter:blur(10px)saturate(150%);background:linear-gradient(135deg,#2080f040 0%,#4098fc2e 100%);border:1px solid #4098fc59;box-shadow:0 4px 16px #2080f040,0 2px 8px #2080f026,inset 0 1px #fff3,inset 0 -1px #2080f033;color:#4098fc!important}.first-level-sidebar.dark-theme .first-menu-item.active .menu-item-label{opacity:1;font-weight:600;color:#4098fc!important}.first-level-sidebar.dark-theme .first-menu-item.active:before{content:"";background:linear-gradient(#2080f0 0%,#4098fc 100%);border-radius:0 2px 2px 0;width:3px;height:28px;position:absolute;top:50%;left:0;transform:translateY(-50%);box-shadow:2px 0 8px #2080f099,0 0 12px #2080f066}.mix-top-layout-container .main-area,.mix-top-layout-container .content-layout{flex-direction:column;flex:1;display:flex;overflow:hidden}.mix-top-layout-container .main-content{background:#f4f7f9;flex-direction:column;flex:1;display:flex;overflow:hidden}.dark-theme .mix-top-layout-container .main-content{background:#121212}.mix-top-layout-container .page-content{flex:1;padding:24px;overflow:hidden auto}.mix-top-layout-container .page-content::-webkit-scrollbar{width:8px;height:8px}.mix-top-layout-container .page-content::-webkit-scrollbar-track{background:0 0}.mix-top-layout-container .page-content::-webkit-scrollbar-thumb{background:#0000001a;border-radius:4px;transition:background .3s}.mix-top-layout-container .page-content::-webkit-scrollbar-thumb:hover{background:#0003}.dark-theme .mix-top-layout-container .page-content::-webkit-scrollbar-thumb{background:#ffffff1a}.dark-theme .mix-top-layout-container .page-content::-webkit-scrollbar-thumb:hover{background:#fff3}.mix-top-layout-container .tags-view-container{background:var(--app-bg-color);border-bottom:1px solid var(--color-border);flex-shrink:0;transition:all .3s cubic-bezier(.4,0,.2,1)}@media (width<=1200px){.top-navbar .navbar-center{padding:0 16px}.top-navbar .brand-subtitle{display:none}}@media (width<=768px){.top-navbar{padding:0 16px}.top-navbar .navbar-divider{display:none}.top-navbar .navbar-right{gap:16px}.first-level-sidebar{width:64px}.first-level-sidebar .first-menu-item{height:60px}.first-level-sidebar .first-menu-item .menu-item-content{width:32px;height:32px}.first-level-sidebar .first-menu-item .menu-item-label{font-size:10px}}.reverse-horizontal-mix-layout-container{flex-direction:column;width:100%;height:100vh;display:flex;overflow:hidden}.reverse-horizontal-mix-layout-container .top-navbar{-webkit-backdrop-filter:blur(20px)saturate(180%);z-index:1000;background:linear-gradient(135deg,#f8fafcf2 0%,#f1f5f9fa 100%);border-bottom:1px solid #00000014;align-items:center;height:64px;padding:0 24px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;box-shadow:0 2px 8px #0000000d,0 1px 2px #00000008}.reverse-horizontal-mix-layout-container .top-navbar:before{content:"";background:linear-gradient(90deg,#0000,#1e40af33 50%,#0000);height:1px;position:absolute;top:0;left:0;right:0}.reverse-horizontal-mix-layout-container .top-navbar.dark-theme{background:linear-gradient(135deg,#1c1c21f2 0%,#1c1c21fa 100%);border-bottom-color:#ffffff14;box-shadow:0 2px 8px #0003,0 1px 2px #0000001a}.reverse-horizontal-mix-layout-container .top-navbar.dark-theme:before{background:linear-gradient(90deg,#0000,#6366f14d 50%,#0000)}.reverse-horizontal-mix-layout-container .top-navbar .navbar-left{flex-shrink:0;align-items:center;gap:16px;display:flex}.reverse-horizontal-mix-layout-container .top-navbar .navbar-left .logo-container{justify-content:center;align-items:center;width:40px;height:40px;display:flex;position:relative}.reverse-horizontal-mix-layout-container .top-navbar .navbar-left .logo-container .logo-glow{background:radial-gradient(circle,#1e40af4d 0%,#0000 70%);border-radius:50%;width:100%;height:100%;animation:2s ease-in-out infinite pulse;position:absolute}.reverse-horizontal-mix-layout-container .top-navbar .navbar-left .logo-container .logo-video{z-index:1;border-radius:8px;position:relative}.reverse-horizontal-mix-layout-container .top-navbar .navbar-left .brand-name{flex-direction:column;gap:2px;display:flex}.reverse-horizontal-mix-layout-container .top-navbar .navbar-left .brand-name .brand-title{color:#1e40aff2;text-shadow:0 1px 2px #ffffff1a;font-size:16px;font-weight:600;line-height:1.2}.reverse-horizontal-mix-layout-container .top-navbar .navbar-left .brand-name .brand-subtitle{color:#1e40afb3;font-size:12px;line-height:1}.reverse-horizontal-mix-layout-container .top-navbar .navbar-left .navbar-divider{background:#1e40af33;width:1px;height:24px}.reverse-horizontal-mix-layout-container .top-navbar .navbar-center{flex:1;align-items:center;min-width:0;padding:0 24px;display:flex;overflow:hidden}.reverse-horizontal-mix-layout-container .top-navbar .navbar-center>*{background:0 0!important}.reverse-horizontal-mix-layout-container .tags-view-container{background-color:var(--app-bg-surface);border-bottom:1px solid var(--app-border-color);flex-shrink:0;transition:all .3s cubic-bezier(.4,0,.2,1)}.reverse-horizontal-mix-layout-container .main-area{flex-direction:row;flex:1;display:flex;position:relative;overflow:hidden}.reverse-horizontal-mix-layout-container .main-area .content-layout{flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}.reverse-horizontal-mix-layout-container .main-area .content-layout .main-content{background-color:var(--app-bg-content);flex-direction:column;flex:1;display:flex;overflow:hidden}.reverse-horizontal-mix-layout-container .main-area .content-layout .main-content .page-content{flex:1;padding:24px;overflow:hidden auto}.reverse-horizontal-mix-layout-container .main-area .content-layout .main-content .page-content::-webkit-scrollbar{width:8px;height:8px}.reverse-horizontal-mix-layout-container .main-area .content-layout .main-content .page-content::-webkit-scrollbar-track{background:0 0}.reverse-horizontal-mix-layout-container .main-area .content-layout .main-content .page-content::-webkit-scrollbar-thumb{background:#0000001a;border-radius:4px;transition:background .3s}.reverse-horizontal-mix-layout-container .main-area .content-layout .main-content .page-content::-webkit-scrollbar-thumb:hover{background:#0003}.dark-theme .reverse-horizontal-mix-layout-container .main-area .content-layout .main-content .page-content::-webkit-scrollbar-thumb{background:#ffffff1a}.dark-theme .reverse-horizontal-mix-layout-container .main-area .content-layout .main-content .page-content::-webkit-scrollbar-thumb:hover{background:#fff3}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle{cursor:pointer;z-index:60;border-radius:8px 0 0 8px;justify-content:center;align-items:center;width:28px;height:56px;transition:right .35s cubic-bezier(.22,1,.36,1),background .25s,box-shadow .25s;display:flex;position:absolute;top:50%;right:0;transform:translateY(-50%)}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.light-theme{-webkit-backdrop-filter:blur(16px)saturate(140%);background:#ffffffe0;border:1px solid #e2e8f080;border-right:none;box-shadow:-1px 0 6px #00000008}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.light-theme .toggle-icon{color:#94a3b8}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.light-theme:hover{background:#fffffff2}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.light-theme:hover .toggle-icon{color:#6366f1}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.dark-theme{-webkit-backdrop-filter:blur(16px)saturate(130%);background:#1e293bbf;border:1px solid #ffffff0f;border-right:none;box-shadow:-1px 0 6px #0000001f}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.dark-theme .toggle-icon{color:#64748b}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.dark-theme:hover{background:#1e293be0}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.dark-theme:hover .toggle-icon{color:#a5b4fc}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.active{transition:right .35s cubic-bezier(.22,1,.36,1);right:240px}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle .toggle-icon{font-size:16px;transition:color .2s}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle:active{transform:translateY(-50%)scale(.95)}.reverse-horizontal-mix-layout-container .main-area .right-sidebar-wrapper{flex-shrink:0;width:240px;transition:width .35s cubic-bezier(.22,1,.36,1);overflow:hidden}.reverse-horizontal-mix-layout-container .main-area .right-sidebar-wrapper.collapsed{width:0}.reverse-horizontal-mix-layout-container .main-area .right-sidebar{z-index:55;flex-direction:column;width:240px;min-width:240px;height:100%;display:flex;position:relative;overflow:hidden}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme{-webkit-backdrop-filter:blur(24px)saturate(150%);background:linear-gradient(165deg,#fffffff2,#f8fafce0);border-left:1px solid #6366f11f;box-shadow:-4px 0 16px -4px #6366f10f,-1px 0 #6366f10a}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme:before{content:"";z-index:4;background:linear-gradient(90deg,#0000,#6366f133,#0000);height:1px;position:absolute;top:0;left:0;right:0}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme .sidebar-header{background:linear-gradient(145deg,#6366f10f,#8b5cf608);border-bottom:1px solid #6366f11a}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme .sidebar-header .header-icon-badge{color:#4f46e5;background:linear-gradient(135deg,#6366f126,#8b5cf61f);border:1px solid #6366f133}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme .sidebar-header .header-title{color:#1e293b}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme .sidebar-menu-list .menu-group .group-label{color:#6366f199}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme .sidebar-menu-list .menu-item{color:#475569}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme .sidebar-menu-list .menu-item:hover{color:#3730a3;background:linear-gradient(145deg,#6366f114,#8b5cf60a);border-color:#6366f11f}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme .sidebar-menu-list .menu-item.active{color:#4338ca;background:linear-gradient(145deg,#6366f11f,#8b5cf614);border-color:#6366f12e;box-shadow:0 1px 4px #6366f11a}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme .sidebar-menu-list .menu-item.active:before{background:linear-gradient(#6366f1,#8b5cf6);box-shadow:1px 0 6px #6366f166}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.light-theme:after{content:"";pointer-events:none;z-index:3;background:linear-gradient(#0000,#fffffff2);height:40px;position:absolute;bottom:0;left:0;right:0}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme{-webkit-backdrop-filter:blur(32px)saturate(130%);background:linear-gradient(165deg,#18181bf2,#121214e6);border-left:1px solid #ffffff14;box-shadow:-4px 0 16px -4px #0000004d,-1px 0 #ffffff0a}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme:before{content:"";z-index:4;background:linear-gradient(90deg,#0000,#ffffff1a,#0000);height:1px;position:absolute;top:0;left:0;right:0}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme .sidebar-header{background:linear-gradient(145deg,#ffffff0d,#ffffff05);border-bottom:1px solid #ffffff0f}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme .sidebar-header .header-icon-badge{color:#a5b4fc;background:#ffffff14;border:1px solid #ffffff1a}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme .sidebar-header .header-title{color:#e2e8f0}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme .sidebar-menu-list .menu-group .group-label{color:#ffffff59}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme .sidebar-menu-list .menu-item{color:#94a3b8}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme .sidebar-menu-list .menu-item:hover{color:#e5e7eb;background:linear-gradient(145deg,#ffffff14,#ffffff0a);border-color:#ffffff14}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme .sidebar-menu-list .menu-item.active{color:#c7d2fe;background:linear-gradient(145deg,#6366f12e,#8b5cf61a);border-color:#6366f133;box-shadow:0 1px 4px #6366f126}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme .sidebar-menu-list .menu-item.active:before{background:linear-gradient(#818cf8,#a78bfa);box-shadow:1px 0 6px #6366f180}.reverse-horizontal-mix-layout-container .main-area .right-sidebar.dark-theme:after{content:"";pointer-events:none;z-index:3;background:linear-gradient(#0000,#121214f2);height:40px;position:absolute;bottom:0;left:0;right:0}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-header{flex-shrink:0;align-items:center;gap:10px;padding:16px 18px;display:flex;position:relative}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-header .header-icon-badge{border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:30px;height:30px;transition:all .3s;display:flex}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-header .header-title{letter-spacing:.02em;font-size:13.5px;font-weight:600}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list{z-index:2;flex:1;padding:6px 10px 48px;position:relative;overflow:hidden auto}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list::-webkit-scrollbar{width:3px}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list::-webkit-scrollbar-track{background:0 0}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list::-webkit-scrollbar-thumb{background:#6366f11f;border-radius:2px}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list::-webkit-scrollbar-thumb:hover{background:#6366f140}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list .menu-group{margin-bottom:4px}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list .menu-group .group-label{letter-spacing:.06em;text-transform:uppercase;align-items:center;gap:6px;padding:10px 12px 5px;font-size:11px;font-weight:600;display:flex}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list .menu-item{cursor:pointer;border:1px solid #0000;border-radius:10px;align-items:center;gap:9px;height:36px;margin:2px 0;padding:0 12px;font-size:13px;font-weight:450;transition:background .25s cubic-bezier(.4,0,.2,1),color .25s,border-color .25s,box-shadow .25s,transform .25s;display:flex;position:relative}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list .menu-item:hover{transform:translate(2px)}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list .menu-item .item-text{white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list .menu-item.active:before{content:"";border-radius:0 2px 2px 0;width:3px;height:16px;transition:all .25s;position:absolute;top:50%;left:-1px;transform:translateY(-50%)}.reverse-horizontal-mix-layout-container .main-area .right-sidebar .sidebar-menu-list .menu-item.active{font-weight:550}@keyframes pulse{0%,to{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}.collapse-arrow{justify-content:center;align-items:center;width:18px;height:18px;transition:transform .3s;display:inline-flex;position:relative}.collapse-arrow .arrow-line{opacity:.85;background-color:currentColor;border-radius:1px;width:2px;height:8px;transition:all .3s;position:absolute}.collapse-arrow.expanded .arrow-line:first-child{transform-origin:bottom;transform:translate(3px)rotate(45deg)}.collapse-arrow.expanded .arrow-line:last-child{transform-origin:top;transform:translate(3px)rotate(-45deg)}.collapse-arrow.collapsed .arrow-line:first-child{transform-origin:bottom;transform:translate(-3px)rotate(-45deg)}.collapse-arrow.collapsed .arrow-line:last-child{transform-origin:top;transform:translate(-3px)rotate(45deg)}@media (width<=768px){.reverse-horizontal-mix-layout-container .main-area .right-sidebar-wrapper{position:absolute;top:0;bottom:0;right:0}.reverse-horizontal-mix-layout-container .main-area .right-sidebar-wrapper .right-sidebar{box-shadow:-6px 0 32px #00000026}.reverse-horizontal-mix-layout-container .main-area .sidebar-toggle.active{right:240px}}.card-layout-container{background-color:var(--app-bg-body);flex-direction:column;height:100vh;display:flex;overflow:hidden}.top-navbar{-webkit-backdrop-filter:blur(20px)saturate(180%);z-index:1000;background:linear-gradient(135deg,#fffffff2 0%,#fffffffa 100%);border-bottom:1px solid #0000000f;justify-content:space-between;align-items:center;height:64px;padding:0 24px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;box-shadow:0 2px 8px #00000008,0 1px 2px #00000005}.top-navbar:before{content:"";background:linear-gradient(90deg,#0000,#6366f133 50%,#0000);height:1px;position:absolute;top:0;left:0;right:0}.top-navbar.dark-theme{background:linear-gradient(135deg,#1c1c21f2 0%,#1c1c21fa 100%);border-bottom-color:#ffffff14;box-shadow:0 2px 8px #0003,0 1px 2px #0000001a}.top-navbar.dark-theme:before{background:linear-gradient(90deg,#0000,#6366f14d 50%,#0000)}.top-navbar .navbar-left{flex-shrink:0;align-items:center;gap:16px;display:flex}.top-navbar .navbar-left .hover-trigger-area{cursor:pointer;z-index:1001;justify-content:center;align-items:center;width:40px;height:40px;display:flex;position:relative}.top-navbar .navbar-left .hover-trigger-area .menu-indicator{color:#6366f1;background:#6366f11a;border-radius:8px;justify-content:center;align-items:center;width:32px;height:32px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.top-navbar .navbar-left .hover-trigger-area .menu-indicator i{font-size:18px}.top-navbar .navbar-left .hover-trigger-area .menu-indicator:hover{background:#6366f126;transform:scale(1.05)}.dark-theme .top-navbar .navbar-left .hover-trigger-area .menu-indicator{color:#8b5cf6;background:#6366f133}.dark-theme .top-navbar .navbar-left .hover-trigger-area .menu-indicator:hover{background:#6366f14d}.top-navbar .navbar-left .menu-toggle{color:#6366f1;cursor:pointer;background:linear-gradient(135deg,#6366f11a 0%,#8b5cf61a 100%);border:1px solid #6366f133;border-radius:10px;justify-content:center;align-items:center;width:40px;height:40px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden}.top-navbar .navbar-left .menu-toggle:before{content:"";opacity:0;background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%);transition:opacity .3s;position:absolute;inset:0}.top-navbar .navbar-left .menu-toggle i{z-index:1;font-size:20px;transition:all .3s;position:relative}.top-navbar .navbar-left .menu-toggle:hover{border-color:#6366f14d;transform:translateY(-2px);box-shadow:0 8px 16px #6366f133}.top-navbar .navbar-left .menu-toggle:hover:before{opacity:.1}.top-navbar .navbar-left .menu-toggle:hover i{color:#8b5cf6;transform:scale(1.1)}.top-navbar .navbar-left .menu-toggle.active{color:#fff;background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%);border-color:#0000;box-shadow:0 4px 12px #6366f14d}.top-navbar .navbar-left .menu-toggle.active i{color:#fff}.top-navbar .navbar-left .menu-toggle .nav-center-button{color:#18a058;cursor:pointer;background:linear-gradient(135deg,#18a0581a 0%,#18a05826 100%);border:1px solid #18a05833;border-radius:10px;justify-content:center;align-items:center;width:40px;height:40px;margin-left:8px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden}.top-navbar .navbar-left .menu-toggle .nav-center-button:before{content:"";opacity:0;background:linear-gradient(135deg,#18a058 0%,#36ad6a 100%);transition:opacity .3s;position:absolute;inset:0}.top-navbar .navbar-left .menu-toggle .nav-center-button i{z-index:1;font-size:20px;transition:all .3s;position:relative}.top-navbar .navbar-left .menu-toggle .nav-center-button:hover{border-color:#18a0584d;transform:translateY(-2px);box-shadow:0 8px 16px #18a05833}.top-navbar .navbar-left .menu-toggle .nav-center-button:hover:before{opacity:.1}.top-navbar .navbar-left .menu-toggle .nav-center-button:hover i{color:#36ad6a;transform:scale(1.1)}.top-navbar .navbar-left .menu-toggle .nav-center-button.active{color:#fff;background:linear-gradient(135deg,#18a058 0%,#36ad6a 100%);border-color:#0000;box-shadow:0 4px 12px #18a0584d}.top-navbar .navbar-left .menu-toggle .nav-center-button.active i{color:#fff}.top-navbar .navbar-left .logo-container{justify-content:center;align-items:center;width:40px;height:40px;display:flex;position:relative}.top-navbar .navbar-left .logo-container .logo-glow{filter:blur(8px);background:radial-gradient(circle,#6366f140 0%,#0000 70%);border-radius:8px;animation:3s ease-in-out infinite pulse-glow;position:absolute;inset:0}.top-navbar .navbar-left .logo-container .logo-video{z-index:10;border-radius:8px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;box-shadow:0 4px 12px #6366f133,0 2px 4px #0000001a}.top-navbar .navbar-left .logo-container .logo-video:hover{transform:scale(1.05)rotate(2deg);box-shadow:0 6px 16px #6366f14d,0 3px 6px #00000026}.top-navbar .navbar-left .brand-name{flex-direction:column;gap:2px;display:flex}.top-navbar .navbar-left .brand-name .brand-title{background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%);-webkit-text-fill-color:transparent;letter-spacing:.5px;-webkit-background-clip:text;background-clip:text;font-size:18px;font-weight:700;line-height:1}.top-navbar .navbar-left .brand-name .brand-subtitle{color:var(--app-text-tertiary);letter-spacing:2px;opacity:.7;font-size:11px;font-weight:500;line-height:1}.top-navbar .navbar-left .navbar-divider{background:linear-gradient(#0000,#6366f14d 50%,#0000);width:1px;height:24px;margin:0 8px}.tags-view-container{background-color:var(--app-bg-surface);border-bottom:1px solid var(--app-border-color);flex-shrink:0;transition:all .3s cubic-bezier(.4,0,.2,1)}.drawer-menu{z-index:1000;opacity:0;background:#fff;border-right:1px solid #e6e6e6;flex-direction:column;width:520px;height:calc(100vh - 64px);transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;top:64px;left:0;transform:translate(-100%);box-shadow:2px 0 8px #00000014}.drawer-menu.dark-theme{background:#1f1f1f;border-right-color:#333;box-shadow:2px 0 8px #0000004d}.drawer-menu.visible{opacity:1;transform:translate(0)}.drawer-menu .drawer-header{background:#fafafa;border-bottom:1px solid #e6e6e6;flex-shrink:0;justify-content:space-between;align-items:center;padding:16px 24px;display:flex}.dark-theme .drawer-menu .drawer-header{background:#262626;border-bottom-color:#333}.drawer-menu .drawer-header .drawer-title{color:#333;align-items:center;gap:8px;font-size:16px;font-weight:500;display:flex}.dark-theme .drawer-menu .drawer-header .drawer-title{color:#e6e6e6}.drawer-menu .drawer-header .drawer-title i{color:#1890ff;font-size:18px}.drawer-menu .drawer-content{flex:1;padding:0;overflow-y:auto}.drawer-menu .drawer-content::-webkit-scrollbar{width:6px}.drawer-menu .drawer-content::-webkit-scrollbar-track{background:#f5f5f5}.drawer-menu .drawer-content::-webkit-scrollbar-thumb{background:#d9d9d9;border-radius:3px;transition:background .3s}.drawer-menu .drawer-content::-webkit-scrollbar-thumb:hover{background:#bfbfbf}.dark-theme .drawer-menu .drawer-content::-webkit-scrollbar-track{background:#262626}.dark-theme .drawer-menu .drawer-content::-webkit-scrollbar-thumb{background:#434343}.dark-theme .drawer-menu .drawer-content::-webkit-scrollbar-thumb:hover{background:#595959}.drawer-menu .drawer-content .menu-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;padding:16px;display:grid}.drawer-menu .drawer-content .menu-grid .menu-category{background:#fff;border:1px solid #f0f0f0;border-radius:8px;transition:all .2s;overflow:hidden}.dark-theme .drawer-menu .drawer-content .menu-grid .menu-category{background:#1f1f1f;border-color:#303030}.drawer-menu .drawer-content .menu-grid .menu-category:hover{transform:translateY(-2px);box-shadow:0 2px 8px #00000014}.drawer-menu .drawer-content .menu-grid .menu-category .category-header{color:#333;cursor:pointer;background:#fafafa;border-bottom:1px solid #f0f0f0;align-items:center;gap:8px;padding:12px 16px;font-size:14px;font-weight:500;transition:all .2s;display:flex}.dark-theme .drawer-menu .drawer-content .menu-grid .menu-category .category-header{color:#e6e6e6;background:#262626;border-bottom-color:#303030}.drawer-menu .drawer-content .menu-grid .menu-category .category-header:hover{color:#1890ff;background:#f0f0f0}.dark-theme .drawer-menu .drawer-content .menu-grid .menu-category .category-header:hover{color:#1890ff;background:#303030}.drawer-menu .drawer-content .menu-grid .menu-category .category-items{flex-direction:column;gap:4px;padding:8px;display:flex}.drawer-menu .drawer-content .menu-grid .menu-category .category-items .menu-item{cursor:pointer;color:#666;border-radius:4px;align-items:center;gap:8px;padding:8px 12px;font-size:13px;transition:all .2s;display:flex}.dark-theme .drawer-menu .drawer-content .menu-grid .menu-category .category-items .menu-item{color:#b3b3b3}.drawer-menu .drawer-content .menu-grid .menu-category .category-items .menu-item:hover{color:#1890ff;background:#f0f0f0}.dark-theme .drawer-menu .drawer-content .menu-grid .menu-category .category-items .menu-item:hover{color:#1890ff;background:#303030}.drawer-menu .drawer-content .menu-grid .menu-category .category-items .menu-item .item-title{white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:400;overflow:hidden}.drawer-menu .drawer-content .menu-grid .menu-category .category-items .submenu-items{border-top:1px dashed #f0f0f0;margin-top:8px;padding-top:8px}.dark-theme .drawer-menu .drawer-content .menu-grid .menu-category .category-items .submenu-items{border-top-color:#303030}.drawer-menu .drawer-content .menu-grid .menu-category .category-items .submenu-items .submenu-title{color:#999;background:#fafafa;border-radius:4px;align-items:center;margin-bottom:4px;padding:4px 8px;font-size:12px;font-weight:500;display:flex}.dark-theme .drawer-menu .drawer-content .menu-grid .menu-category .category-items .submenu-items .submenu-title{color:gray;background:#262626}.drawer-menu .drawer-content .menu-grid .menu-category .category-items .submenu-items .submenu-item{cursor:pointer;color:#666;border-radius:4px;align-items:center;gap:6px;padding:6px 8px 6px 16px;font-size:12px;transition:all .2s;display:flex}.dark-theme .drawer-menu .drawer-content .menu-grid .menu-category .category-items .submenu-items .submenu-item{color:#b3b3b3}.drawer-menu .drawer-content .menu-grid .menu-category .category-items .submenu-items .submenu-item:hover{color:#1890ff;background:#f0f0f0}.dark-theme .drawer-menu .drawer-content .menu-grid .menu-category .category-items .submenu-items .submenu-item:hover{color:#1890ff;background:#303030}.drawer-menu .drawer-content .menu-grid .menu-category .category-items .submenu-items .submenu-item .item-title{font-size:12px;font-weight:400}.main-content-area{flex-direction:column;flex:1;display:flex;overflow:hidden}.main-content-area .content-layout{flex-direction:column;flex:1;display:flex}.main-content-area .content-layout .main-content{background-color:var(--app-bg-content);flex:1;overflow:auto}.main-content-area .content-layout .main-content .page-content{min-height:100%}@media (width<=1200px){.card-menu-area .card-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}.sidebar-menu{width:280px}}@media (width<=768px){.card-menu-area{padding:20px}.card-menu-area .card-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}.card-menu-area .card-grid .menu-card{gap:16px;padding:20px}.card-menu-area .card-grid .menu-card .card-icon{width:60px;height:60px}.card-menu-area .card-grid .menu-card .card-icon .default-icon{font-size:24px}.card-menu-area .card-grid .menu-card .card-content .card-title{font-size:16px}.card-menu-area .card-grid .menu-card .card-content .card-description{font-size:13px}.sidebar-menu{width:100%;max-width:320px}.top-navbar{padding:0 16px}.top-navbar .navbar-left{gap:12px}.top-navbar .navbar-left .brand-name .brand-title{font-size:16px}.top-navbar .navbar-left .brand-name .brand-subtitle{display:none}}@media (width<=480px){.card-menu-area{padding:16px}.card-menu-area .card-grid{grid-template-columns:1fr;gap:16px}.card-menu-area .card-grid .menu-card{gap:12px;padding:16px}.card-menu-area .card-grid .menu-card .card-icon{width:56px;height:56px}.card-menu-area .card-grid .menu-card .card-icon .default-icon{font-size:22px}.card-menu-area .card-grid .menu-card .card-content .card-title{font-size:15px}.card-menu-area .card-grid .menu-card .card-content .card-description{font-size:12px}.sidebar-menu{width:100%;max-width:none}.sidebar-menu .sidebar-header{padding:16px 20px}.sidebar-menu .sidebar-header .sidebar-title{font-size:15px}.sidebar-menu .sidebar-menu-tree{padding:12px 0}.sidebar-menu .sidebar-menu-tree :deep(.n-menu-item){margin:2px 12px;padding:8px 12px}.top-navbar{padding:0 12px}.top-navbar .navbar-left{gap:8px}.top-navbar .navbar-left .menu-toggle{width:36px;height:36px}.top-navbar .navbar-left .menu-toggle i{font-size:18px}.top-navbar .navbar-left .logo-container .logo-video{width:32px;height:32px}.top-navbar .navbar-left .navbar-divider{display:none}}.grid-icon[data-v-3e4915c5]{grid-template-columns:repeat(2,1fr);gap:2.5px;width:18px;height:18px;padding:1px;display:inline-grid}.grid-icon span[data-v-3e4915c5]{opacity:.85;background-color:currentColor;border-radius:2px}.hamburger-icon[data-v-3e4915c5]{flex-direction:column;justify-content:space-between;width:20px;height:16px;padding:2px 0;display:inline-flex}.hamburger-icon span[data-v-3e4915c5]{opacity:.85;background-color:currentColor;border-radius:1px;width:100%;height:2px;transition:all .2s;display:block}.settings-tabs[data-v-b57a947e] .n-tabs-nav{padding:0 4px}.settings-section[data-v-b57a947e]{border-bottom:1px solid var(--n-border-color);margin-bottom:24px;padding-bottom:20px}.settings-section[data-v-b57a947e]:last-child{border-bottom:none}.section-title[data-v-b57a947e]{color:var(--n-text-color);justify-content:space-between;align-items:center;margin-bottom:8px;font-size:14px;font-weight:600;display:flex}.preset-grid[data-v-b57a947e]{grid-template-columns:repeat(3,1fr);gap:16px;margin-top:12px;display:grid}.preset-card[data-v-b57a947e]{border:2px solid var(--n-border-color);background:var(--n-color);cursor:pointer;text-align:center;border-radius:12px;padding:18px 14px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.preset-card[data-v-b57a947e]:before{content:"";background:linear-gradient(90deg, var(--n-color-target), var(--n-color-target));opacity:0;border-radius:3px 3px 0 0;height:3px;transition:opacity .3s;position:absolute;top:0;left:0;right:0}.preset-card[data-v-b57a947e]:hover{border-color:var(--n-color-target);box-shadow:0 8px 16px var(--primary-color-shadow,#2080f01f);transform:translateY(-4px)}.preset-card[data-v-b57a947e]:hover:before{opacity:1}.preset-card:hover .preset-icon[data-v-b57a947e]{transform:scale(1.1)}.preset-card:hover .preset-name[data-v-b57a947e]{color:var(--n-color-target)}.preset-card.active[data-v-b57a947e]{border-color:var(--n-color-target);background:var(--n-color-target-light);box-shadow:0 8px 20px var(--primary-color-shadow,#2080f033)}.preset-card.active[data-v-b57a947e]:before{opacity:1}.preset-card.active .preset-name[data-v-b57a947e]{color:var(--n-color-target);font-weight:600}.preset-icon[data-v-b57a947e]{margin-bottom:10px;font-size:36px;transition:all .3s}.preset-name[data-v-b57a947e]{color:var(--n-text-color);margin-bottom:8px;font-size:14px;font-weight:500;transition:all .3s}.preset-color[data-v-b57a947e]{justify-content:center;display:flex}.color-dot[data-v-b57a947e]{border:2px solid #fff;border-radius:50%;width:24px;height:24px;transition:all .3s;box-shadow:0 2px 8px #00000026}.color-dot[data-v-b57a947e]:hover{transform:scale(1.1);box-shadow:0 4px 12px #0003}.mode-group[data-v-b57a947e]{width:100%}.mode-group[data-v-b57a947e] .n-radio-button{flex:1}.color-picker-wrapper[data-v-b57a947e]{align-items:center;gap:12px;display:flex}.color-value[data-v-b57a947e]{width:80px;color:var(--n-text-color-2);font-family:Courier New,monospace;font-size:13px}.radius-group[data-v-b57a947e],.transition-group[data-v-b57a947e],.menu-expand-group[data-v-b57a947e]{width:100%}.radius-group[data-v-b57a947e] .n-radio-button,.transition-group[data-v-b57a947e] .n-radio-button,.menu-expand-group[data-v-b57a947e] .n-radio-button{flex:1}.layout-grid[data-v-b57a947e]{grid-template-columns:repeat(3,1fr);gap:16px;display:grid}.layout-item[data-v-b57a947e]{border:2px solid var(--n-border-color);background:var(--n-color);cursor:pointer;border-radius:12px;flex-direction:column;align-items:center;gap:10px;padding:16px 12px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden}.layout-item[data-v-b57a947e]:before{content:"";background:linear-gradient(90deg, var(--n-color-target), var(--n-color-target));opacity:0;border-radius:3px 3px 0 0;height:3px;transition:opacity .3s;position:absolute;top:0;left:0;right:0}.layout-item[data-v-b57a947e]:hover:not(.disabled){border-color:var(--n-color-target);box-shadow:0 8px 16px var(--primary-color-shadow,#2080f01f);transform:translateY(-4px)}.layout-item[data-v-b57a947e]:hover:not(.disabled):before{opacity:1}.layout-item:hover:not(.disabled) .layout-svg[data-v-b57a947e]{color:var(--n-color-target);transform:scale(1.05)}.layout-item:hover:not(.disabled) .layout-label[data-v-b57a947e]{color:var(--n-color-target)}.layout-item.active[data-v-b57a947e]{border-color:var(--n-color-target);background:var(--n-color-target-light);box-shadow:0 8px 20px var(--primary-color-shadow,#2080f033)}.layout-item.active[data-v-b57a947e]:before{opacity:1}.layout-item.active .layout-svg[data-v-b57a947e]{color:var(--primary-color,#409eff)!important}.layout-item.active .layout-label[data-v-b57a947e]{font-weight:600;color:var(--primary-color,#409eff)!important}.layout-item.disabled[data-v-b57a947e]{cursor:not-allowed;opacity:.5;filter:grayscale(.8)}.layout-item.disabled[data-v-b57a947e]:hover{box-shadow:none;border-color:var(--n-border-color);transform:none}.layout-item.disabled[data-v-b57a947e]:hover:before{opacity:0}.layout-screenshot[data-v-b57a947e]{background:var(--n-color-modal);border-radius:8px;justify-content:center;align-items:center;width:100%;height:56px;padding:8px;transition:all .3s;display:flex}.layout-svg[data-v-b57a947e]{color:#999;width:64px;height:48px;transition:all .3s}[data-v-b57a947e] .layout-svg rect{fill:currentColor!important}.layout-label[data-v-b57a947e]{color:var(--n-text-color);text-align:center;flex-direction:column;align-items:center;gap:6px;font-size:13px;font-weight:500;line-height:1.4;transition:all .3s;display:flex}.badge-soon[data-v-b57a947e]{color:#fff;white-space:nowrap;background:linear-gradient(135deg,#faad14 0%,#fa8c16 100%);border-radius:3px;padding:1px 5px;font-size:10px;font-weight:600;box-shadow:0 1px 3px #faad144d}.setting-item[data-v-b57a947e]{color:var(--n-text-color);justify-content:space-between;align-items:center;padding:10px 0;font-size:13px;display:flex}.slider-item[data-v-b57a947e]{margin-bottom:20px}.slider-label[data-v-b57a947e]{color:var(--n-text-color);justify-content:space-between;margin-bottom:8px;font-size:13px;display:flex}.slider-value[data-v-b57a947e]{color:var(--n-color-target);font-weight:600}.action-buttons-grid[data-v-b57a947e]{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.setting-label[data-v-b57a947e]{flex-direction:column;gap:4px;display:flex}.setting-label .setting-desc[data-v-b57a947e]{color:var(--n-text-color-2);opacity:.8;font-size:12px}.system-info[data-v-b57a947e]{flex-direction:column;gap:12px;margin-top:12px;display:flex}.info-item[data-v-b57a947e]{background:var(--n-color);border:1px solid var(--n-border-color);border-radius:8px;justify-content:space-between;align-items:center;padding:10px 12px;transition:all .2s;display:flex}.info-item[data-v-b57a947e]:hover{border-color:var(--n-color-target);background:var(--n-color-target-light)}.info-label[data-v-b57a947e]{color:var(--n-text-color-2);font-size:13px;font-weight:500}.info-value[data-v-b57a947e]{color:var(--n-text-color);font-family:Consolas,Monaco,monospace;font-size:13px;font-weight:600}.brand-logo[data-v-fd1c2eec]{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:10px;display:flex}.brand-logo--collapsed[data-v-fd1c2eec]{justify-content:center}.brand-logo__icon[data-v-fd1c2eec]{flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative}.brand-logo__glow[data-v-fd1c2eec]{pointer-events:none;background:radial-gradient(circle,#6366f126 0%,#0000 70%);border-radius:50%;position:absolute;inset:-4px}.brand-logo__media[data-v-fd1c2eec]{object-fit:contain;border-radius:8px}.brand-logo__name[data-v-fd1c2eec]{white-space:nowrap;flex-direction:column;line-height:1.2;display:flex}.brand-logo__title[data-v-fd1c2eec]{-webkit-text-fill-color:transparent;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);-webkit-background-clip:text;background-clip:text;font-size:15px;font-weight:700}.brand-logo__subtitle[data-v-fd1c2eec]{opacity:.6;letter-spacing:.5px;font-size:10px}.brand-logo__divider[data-v-fd1c2eec]{background:linear-gradient(#0000 0%,#8080804d 50%,#0000 100%);width:1px;height:24px;margin:0 6px}.icon-menu[data-v-f985d475]{flex-direction:column;align-items:center;gap:2px;width:100%;padding:4px 0;display:flex}.icon-menu__item[data-v-f985d475]{cursor:pointer;opacity:.7;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:calc(100% - 12px);margin:0 6px;padding:10px 4px 8px;transition:all .25s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.icon-menu__item[data-v-f985d475]:hover{opacity:1;background:#6366f114;transform:translateY(-1px)}.icon-menu__item--active[data-v-f985d475]{opacity:1;background:linear-gradient(135deg,#6366f126 0%,#8b5cf61a 100%);box-shadow:0 2px 8px #6366f133}.icon-menu__item--active[data-v-f985d475]:before{content:"";background:linear-gradient(#667eea,#764ba2);border-radius:0 3px 3px 0;width:3px;height:60%;position:absolute;top:50%;left:0;transform:translateY(-50%)}.icon-menu__icon[data-v-f985d475]{justify-content:center;align-items:center;width:28px;height:28px;font-size:20px;display:flex}.icon-menu__fallback[data-v-f985d475]{background:#8080801a;border-radius:8px;justify-content:center;align-items:center;width:28px;height:28px;font-size:14px;font-weight:600;display:flex}.icon-menu__label[data-v-f985d475]{text-align:center;text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:11px;font-weight:500;line-height:1.2;overflow:hidden}.floating-menu[data-v-0588c318]{z-index:100;-webkit-backdrop-filter:blur(20px);border-right:1px solid #8080801a;width:240px;height:100%;position:absolute;top:0;left:100%;overflow-y:auto}.floating-menu.light-theme[data-v-0588c318]{background:#fffffff2;box-shadow:4px 0 24px #00000014}.floating-menu.dark-theme[data-v-0588c318]{background:#1e1e24f2;box-shadow:4px 0 24px #0000004d}.floating-menu__header[data-v-0588c318]{border-bottom:1px solid #8080801a;padding:16px 20px 12px}.floating-menu__brand-title[data-v-0588c318]{-webkit-text-fill-color:transparent;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;font-size:14px;font-weight:700}.floating-menu__brand-subtitle[data-v-0588c318]{opacity:.5;margin-top:2px;font-size:11px;display:block}.floating-menu__list[data-v-0588c318]{padding:8px 12px}.floating-menu__group[data-v-0588c318]{margin-bottom:8px}.floating-menu__group-title[data-v-0588c318]{opacity:.5;text-transform:uppercase;letter-spacing:.5px;align-items:center;gap:6px;padding:8px 8px 4px;font-size:12px;font-weight:600;display:flex}.floating-menu__item[data-v-0588c318]{cursor:pointer;border-radius:8px;align-items:center;gap:10px;margin:2px 0;padding:10px 12px;font-size:14px;transition:all .2s;display:flex}.floating-menu__item[data-v-0588c318]:hover{background:#6366f114}.floating-menu__item.active[data-v-0588c318]{color:#667eea;background:linear-gradient(135deg,#6366f11f,#8b5cf614)}.floating-menu__item--sub[data-v-0588c318]{padding-left:20px;font-size:13px}.floating-menu__item-text[data-v-0588c318]{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.slide-fade-enter-active[data-v-0588c318],.slide-fade-leave-active[data-v-0588c318]{transition:all .3s cubic-bezier(.4,0,.2,1)}.slide-fade-enter-from[data-v-0588c318],.slide-fade-leave-to[data-v-0588c318]{opacity:0;transform:translate(-12px)}.side-menu-toggle[data-v-1909f229]{cursor:pointer;z-index:10;border-radius:12px;justify-content:center;align-items:center;width:24px;height:48px;font-size:14px;transition:all .25s;display:flex;position:absolute;top:50%;right:0;transform:translateY(-50%)translate(50%)}.side-menu-toggle.light-theme[data-v-1909f229]{background:#ffffffe6;box-shadow:0 2px 8px #0000001a}.side-menu-toggle.dark-theme[data-v-1909f229]{background:#28282ee6;box-shadow:0 2px 8px #0000004d}.side-menu-toggle[data-v-1909f229]:hover{transform:translateY(-50%)translate(50%)scale(1.1)}.side-menu[data-v-1909f229]{width:100%;height:100%;padding:0 8px;overflow-y:auto}.side-menu.light-theme[data-v-1909f229]{background:#fffffff2;border-left:1px solid #0000000f}.side-menu.dark-theme[data-v-1909f229]{background:#1e1e24f2;border-left:1px solid #ffffff0f}.side-menu__header[data-v-1909f229]{border-bottom:1px solid #8080801a;align-items:center;gap:8px;margin-bottom:8px;padding:16px 12px 12px;display:flex}.side-menu__header-icon[data-v-1909f229]{background:linear-gradient(135deg,#6366f11f,#8b5cf614);border-radius:8px;justify-content:center;align-items:center;width:28px;height:28px;display:flex}.side-menu__header-title[data-v-1909f229]{font-size:14px;font-weight:600}.side-menu__list[data-v-1909f229]{padding:4px 0}.side-menu__group[data-v-1909f229]{margin-bottom:8px}.side-menu__group-label[data-v-1909f229]{opacity:.5;align-items:center;gap:6px;padding:6px 12px;font-size:12px;font-weight:600;display:flex}.side-menu__item[data-v-1909f229]{cursor:pointer;border-radius:8px;align-items:center;gap:8px;margin:2px 0;padding:9px 12px;font-size:13px;transition:all .2s;display:flex}.side-menu__item[data-v-1909f229]:hover{background:#6366f10f}.side-menu__item.active[data-v-1909f229]{color:#667eea;background:linear-gradient(135deg,#6366f11a,#8b5cf60f);font-weight:500}.side-menu__item-text[data-v-1909f229]{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.glass-slide-enter-active[data-v-1909f229],.glass-slide-leave-active[data-v-1909f229]{transition:all .35s cubic-bezier(.4,0,.2,1)}.glass-slide-enter-from[data-v-1909f229],.glass-slide-leave-to[data-v-1909f229]{opacity:0;transform:translate(20px)}.drawer-menu[data-v-b0d3e73b]{z-index:100;opacity:0;pointer-events:none;-webkit-backdrop-filter:blur(20px);border-bottom-right-radius:16px;border-bottom-left-radius:16px;max-height:60vh;transition:all .3s cubic-bezier(.4,0,.2,1);position:absolute;top:100%;left:0;right:0;overflow-y:auto;transform:translateY(-8px)}.drawer-menu.visible[data-v-b0d3e73b]{opacity:1;pointer-events:all;transform:translateY(0)}.drawer-menu.light-theme[data-v-b0d3e73b]{background:#fffffff5;border:1px solid #0000000f;border-top:none;box-shadow:0 8px 32px #0000001f}.drawer-menu.dark-theme[data-v-b0d3e73b]{background:#1e1e24f5;border:1px solid #ffffff0f;border-top:none;box-shadow:0 8px 32px #0006}.drawer-menu__header[data-v-b0d3e73b]{padding:16px 24px 8px}.drawer-menu__title[data-v-b0d3e73b]{align-items:center;gap:8px;font-size:15px;font-weight:600;display:flex}.drawer-menu__content[data-v-b0d3e73b]{padding:8px 24px 20px}.drawer-menu__grid[data-v-b0d3e73b]{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;display:grid}.drawer-menu__category[data-v-b0d3e73b]{padding:0}.drawer-menu__category-header[data-v-b0d3e73b]{cursor:pointer;border-radius:8px;align-items:center;gap:8px;padding:8px 12px;font-size:14px;font-weight:600;transition:background .2s;display:flex}.drawer-menu__category-header[data-v-b0d3e73b]:hover{background:#6366f10f}.drawer-menu__items[data-v-b0d3e73b]{padding-left:8px}.drawer-menu__item[data-v-b0d3e73b]{cursor:pointer;border-radius:6px;align-items:center;gap:8px;margin:1px 0;padding:7px 12px;font-size:13px;transition:all .2s;display:flex}.drawer-menu__item[data-v-b0d3e73b]:hover{color:#667eea;background:#6366f114}.drawer-menu__item--sub[data-v-b0d3e73b]{padding-left:16px;font-size:12px}.drawer-menu__item-text[data-v-b0d3e73b]{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.drawer-menu__sub-items[data-v-b0d3e73b]{padding:4px 0}.drawer-menu__sub-title[data-v-b0d3e73b]{opacity:.4;padding:4px 12px;font-size:11px;font-weight:600}.grid-icon[data-v-b0d3e73b]{grid-template-columns:repeat(2,1fr);gap:2.5px;width:18px;height:18px;padding:1px;display:inline-grid}.grid-icon span[data-v-b0d3e73b]{opacity:.85;background-color:currentColor;border-radius:2px}.menu-trigger[data-v-2c20af78]{cursor:pointer;justify-content:center;align-items:center;height:100%;padding:0 8px;display:flex}.menu-trigger__indicator[data-v-2c20af78]{opacity:.6;border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;font-size:18px;transition:all .25s;display:flex}.menu-trigger__indicator[data-v-2c20af78]:hover{opacity:1;background:#6366f114}.hamburger-icon[data-v-2c20af78]{flex-direction:column;justify-content:space-between;width:20px;height:16px;padding:2px 0;display:inline-flex}.hamburger-icon span[data-v-2c20af78]{opacity:.85;background-color:currentColor;border-radius:1px;width:100%;height:2px;transition:all .2s;display:block}
|
|
2
|
+
/*$vite$:1*/
|
package/dist/index.d.ts
CHANGED
|
@@ -314,6 +314,7 @@ borderRadius: Ref<BorderRadiusSize, BorderRadiusSize>;
|
|
|
314
314
|
transitionType: Ref<TransitionType, TransitionType>;
|
|
315
315
|
enableTransition: Ref<boolean, boolean>;
|
|
316
316
|
layoutMode: Ref<LayoutMode, LayoutMode>;
|
|
317
|
+
menuExpandMode: Ref<MenuExpandMode, MenuExpandMode>;
|
|
317
318
|
collapsed: Ref<boolean, boolean>;
|
|
318
319
|
fixedHeader: Ref<boolean, boolean>;
|
|
319
320
|
showBreadcrumb: Ref<boolean, boolean>;
|
|
@@ -336,13 +337,14 @@ applyPreset: (preset: ThemePreset) => Promise<void>;
|
|
|
336
337
|
resetSettings: () => void;
|
|
337
338
|
updateThemeMode: (mode: ThemeMode) => Promise<void>;
|
|
338
339
|
toggleCollapse: () => void;
|
|
339
|
-
}, "themeMode" | "layoutMode" | "primaryColor" | "borderRadius" | "transitionType" | "enableTransition" | "collapsed" | "fixedHeader" | "showBreadcrumb" | "showBreadcrumbIcon" | "showTagsView" | "tagsViewHeight" | "tagsViewStyle" | "showFooter" | "sidebarWidth" | "sidebarCollapsedWidth" | "headerHeight" | "enableHotkeys" | "version">, Pick<{
|
|
340
|
+
}, "themeMode" | "layoutMode" | "primaryColor" | "borderRadius" | "transitionType" | "enableTransition" | "menuExpandMode" | "collapsed" | "fixedHeader" | "showBreadcrumb" | "showBreadcrumbIcon" | "showTagsView" | "tagsViewHeight" | "tagsViewStyle" | "showFooter" | "sidebarWidth" | "sidebarCollapsedWidth" | "headerHeight" | "enableHotkeys" | "version">, Pick<{
|
|
340
341
|
themeMode: Ref<ThemeMode, ThemeMode>;
|
|
341
342
|
primaryColor: Ref<string, string>;
|
|
342
343
|
borderRadius: Ref<BorderRadiusSize, BorderRadiusSize>;
|
|
343
344
|
transitionType: Ref<TransitionType, TransitionType>;
|
|
344
345
|
enableTransition: Ref<boolean, boolean>;
|
|
345
346
|
layoutMode: Ref<LayoutMode, LayoutMode>;
|
|
347
|
+
menuExpandMode: Ref<MenuExpandMode, MenuExpandMode>;
|
|
346
348
|
collapsed: Ref<boolean, boolean>;
|
|
347
349
|
fixedHeader: Ref<boolean, boolean>;
|
|
348
350
|
showBreadcrumb: Ref<boolean, boolean>;
|
|
@@ -372,6 +374,7 @@ borderRadius: Ref<BorderRadiusSize, BorderRadiusSize>;
|
|
|
372
374
|
transitionType: Ref<TransitionType, TransitionType>;
|
|
373
375
|
enableTransition: Ref<boolean, boolean>;
|
|
374
376
|
layoutMode: Ref<LayoutMode, LayoutMode>;
|
|
377
|
+
menuExpandMode: Ref<MenuExpandMode, MenuExpandMode>;
|
|
375
378
|
collapsed: Ref<boolean, boolean>;
|
|
376
379
|
fixedHeader: Ref<boolean, boolean>;
|
|
377
380
|
showBreadcrumb: Ref<boolean, boolean>;
|
|
@@ -514,6 +517,8 @@ export declare interface LayoutContext {
|
|
|
514
517
|
isDark: ComputedRef<boolean>;
|
|
515
518
|
/** 当前布局模式 */
|
|
516
519
|
layoutMode: ComputedRef<LayoutMode>;
|
|
520
|
+
/** 菜单展开方式 */
|
|
521
|
+
menuExpandMode?: ComputedRef<MenuExpandMode>;
|
|
517
522
|
/** 侧边栏宽度 (px) */
|
|
518
523
|
sidebarWidth: ComputedRef<number>;
|
|
519
524
|
/** 侧边栏折叠后宽度 (px) */
|
|
@@ -560,6 +565,11 @@ export declare interface LayoutInfo {
|
|
|
560
565
|
*/
|
|
561
566
|
export declare type LayoutMode = "side" | "top" | "mix" | "mix-top" | "reverse-horizontal-mix" | "card-layout";
|
|
562
567
|
|
|
568
|
+
/**
|
|
569
|
+
* 菜单展开方式
|
|
570
|
+
*/
|
|
571
|
+
export declare type MenuExpandMode = "inline" | "panel";
|
|
572
|
+
|
|
563
573
|
/**
|
|
564
574
|
* 菜单项类型
|
|
565
575
|
* - `group` 分组
|
|
@@ -671,6 +681,8 @@ export declare interface SettingsState {
|
|
|
671
681
|
enableTransition: boolean;
|
|
672
682
|
/** 布局模式:左侧/顶部/混合 */
|
|
673
683
|
layoutMode: LayoutMode;
|
|
684
|
+
/** 菜单展开方式:传统内联/右侧面板 */
|
|
685
|
+
menuExpandMode: MenuExpandMode;
|
|
674
686
|
/** 侧边栏是否折叠 */
|
|
675
687
|
collapsed: boolean;
|
|
676
688
|
/** 固定头部 */
|
|
@@ -730,6 +742,7 @@ borderRadius: Ref<BorderRadiusSize, BorderRadiusSize>;
|
|
|
730
742
|
transitionType: Ref<TransitionType, TransitionType>;
|
|
731
743
|
enableTransition: Ref<boolean, boolean>;
|
|
732
744
|
layoutMode: Ref<LayoutMode, LayoutMode>;
|
|
745
|
+
menuExpandMode: Ref<MenuExpandMode, MenuExpandMode>;
|
|
733
746
|
collapsed: Ref<boolean, boolean>;
|
|
734
747
|
fixedHeader: Ref<boolean, boolean>;
|
|
735
748
|
showBreadcrumb: Ref<boolean, boolean>;
|
|
@@ -752,13 +765,14 @@ applyPreset: (preset: ThemePreset) => Promise<void>;
|
|
|
752
765
|
resetSettings: () => void;
|
|
753
766
|
updateThemeMode: (mode: ThemeMode) => Promise<void>;
|
|
754
767
|
toggleCollapse: () => void;
|
|
755
|
-
}, "themeMode" | "layoutMode" | "primaryColor" | "borderRadius" | "transitionType" | "enableTransition" | "collapsed" | "fixedHeader" | "showBreadcrumb" | "showBreadcrumbIcon" | "showTagsView" | "tagsViewHeight" | "tagsViewStyle" | "showFooter" | "sidebarWidth" | "sidebarCollapsedWidth" | "headerHeight" | "enableHotkeys" | "version">, Pick<{
|
|
768
|
+
}, "themeMode" | "layoutMode" | "primaryColor" | "borderRadius" | "transitionType" | "enableTransition" | "menuExpandMode" | "collapsed" | "fixedHeader" | "showBreadcrumb" | "showBreadcrumbIcon" | "showTagsView" | "tagsViewHeight" | "tagsViewStyle" | "showFooter" | "sidebarWidth" | "sidebarCollapsedWidth" | "headerHeight" | "enableHotkeys" | "version">, Pick<{
|
|
756
769
|
themeMode: Ref<ThemeMode, ThemeMode>;
|
|
757
770
|
primaryColor: Ref<string, string>;
|
|
758
771
|
borderRadius: Ref<BorderRadiusSize, BorderRadiusSize>;
|
|
759
772
|
transitionType: Ref<TransitionType, TransitionType>;
|
|
760
773
|
enableTransition: Ref<boolean, boolean>;
|
|
761
774
|
layoutMode: Ref<LayoutMode, LayoutMode>;
|
|
775
|
+
menuExpandMode: Ref<MenuExpandMode, MenuExpandMode>;
|
|
762
776
|
collapsed: Ref<boolean, boolean>;
|
|
763
777
|
fixedHeader: Ref<boolean, boolean>;
|
|
764
778
|
showBreadcrumb: Ref<boolean, boolean>;
|
|
@@ -788,6 +802,7 @@ borderRadius: Ref<BorderRadiusSize, BorderRadiusSize>;
|
|
|
788
802
|
transitionType: Ref<TransitionType, TransitionType>;
|
|
789
803
|
enableTransition: Ref<boolean, boolean>;
|
|
790
804
|
layoutMode: Ref<LayoutMode, LayoutMode>;
|
|
805
|
+
menuExpandMode: Ref<MenuExpandMode, MenuExpandMode>;
|
|
791
806
|
collapsed: Ref<boolean, boolean>;
|
|
792
807
|
fixedHeader: Ref<boolean, boolean>;
|
|
793
808
|
showBreadcrumb: Ref<boolean, boolean>;
|
|
@@ -953,6 +968,7 @@ borderRadius: Ref<BorderRadiusSize, BorderRadiusSize>;
|
|
|
953
968
|
transitionType: Ref<TransitionType, TransitionType>;
|
|
954
969
|
enableTransition: Ref<boolean, boolean>;
|
|
955
970
|
layoutMode: Ref<LayoutMode, LayoutMode>;
|
|
971
|
+
menuExpandMode: Ref<MenuExpandMode, MenuExpandMode>;
|
|
956
972
|
collapsed: Ref<boolean, boolean>;
|
|
957
973
|
fixedHeader: Ref<boolean, boolean>;
|
|
958
974
|
showBreadcrumb: Ref<boolean, boolean>;
|
|
@@ -975,13 +991,14 @@ applyPreset: (preset: ThemePreset) => Promise<void>;
|
|
|
975
991
|
resetSettings: () => void;
|
|
976
992
|
updateThemeMode: (mode: ThemeMode) => Promise<void>;
|
|
977
993
|
toggleCollapse: () => void;
|
|
978
|
-
}, "themeMode" | "layoutMode" | "primaryColor" | "borderRadius" | "transitionType" | "enableTransition" | "collapsed" | "fixedHeader" | "showBreadcrumb" | "showBreadcrumbIcon" | "showTagsView" | "tagsViewHeight" | "tagsViewStyle" | "showFooter" | "sidebarWidth" | "sidebarCollapsedWidth" | "headerHeight" | "enableHotkeys" | "version">, Pick<{
|
|
994
|
+
}, "themeMode" | "layoutMode" | "primaryColor" | "borderRadius" | "transitionType" | "enableTransition" | "menuExpandMode" | "collapsed" | "fixedHeader" | "showBreadcrumb" | "showBreadcrumbIcon" | "showTagsView" | "tagsViewHeight" | "tagsViewStyle" | "showFooter" | "sidebarWidth" | "sidebarCollapsedWidth" | "headerHeight" | "enableHotkeys" | "version">, Pick<{
|
|
979
995
|
themeMode: Ref<ThemeMode, ThemeMode>;
|
|
980
996
|
primaryColor: Ref<string, string>;
|
|
981
997
|
borderRadius: Ref<BorderRadiusSize, BorderRadiusSize>;
|
|
982
998
|
transitionType: Ref<TransitionType, TransitionType>;
|
|
983
999
|
enableTransition: Ref<boolean, boolean>;
|
|
984
1000
|
layoutMode: Ref<LayoutMode, LayoutMode>;
|
|
1001
|
+
menuExpandMode: Ref<MenuExpandMode, MenuExpandMode>;
|
|
985
1002
|
collapsed: Ref<boolean, boolean>;
|
|
986
1003
|
fixedHeader: Ref<boolean, boolean>;
|
|
987
1004
|
showBreadcrumb: Ref<boolean, boolean>;
|
|
@@ -1011,6 +1028,7 @@ borderRadius: Ref<BorderRadiusSize, BorderRadiusSize>;
|
|
|
1011
1028
|
transitionType: Ref<TransitionType, TransitionType>;
|
|
1012
1029
|
enableTransition: Ref<boolean, boolean>;
|
|
1013
1030
|
layoutMode: Ref<LayoutMode, LayoutMode>;
|
|
1031
|
+
menuExpandMode: Ref<MenuExpandMode, MenuExpandMode>;
|
|
1014
1032
|
collapsed: Ref<boolean, boolean>;
|
|
1015
1033
|
fixedHeader: Ref<boolean, boolean>;
|
|
1016
1034
|
showBreadcrumb: Ref<boolean, boolean>;
|