@import"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined";@import"https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";@import"https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap";@import"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css";:root{--background-color: rgb(24, 24, 37);--hover-background-color: rgba(203, 166, 247, .13);--input-background-color: rgb(30, 30, 46);--input-hover-background-color: rgba(30, 30, 46, .49);--tab-bg-color: rgb(49, 50, 68);--tab-active-bg-color: rgb(88, 91, 112);--utility-background-color: rgb(49, 50, 68);--dark-translucent-bg: rgba(88, 91, 112, .43);--background-image: url(/res/DDX.bg.png);--logo: url(/res/logo.png);--border-color: rgb(88, 91, 112);--text-color: rgb(205, 214, 244);--hover-text-color: rgba(205, 214, 244, .7);--active-text-color: rgba(203, 166, 247, 1);--tab-content-margin: 9px;--searchbar-width: calc(100% - 72px) ;--main-color: rgb(203, 166, 247);--muted: rgb(172, 176, 190);--faded-main-color: rgba(203, 166, 247, .26)}:root{--background-color: rgb(24, 24, 37);--hover-background-color: rgba(203, 166, 247, .13);--input-background-color: rgb(30, 30, 46);--input-hover-background-color: rgba(30, 30, 46, .49);--tab-bg-color: rgb(49, 50, 68);--tab-active-bg-color: rgb(88, 91, 112);--utility-background-color: rgb(49, 50, 68);--dark-translucent-bg: rgba(88, 91, 112, .43);--background-image: url(/res/DDX.bg.png);--logo: url(/res/logo.png);--border-color: rgb(88, 91, 112);--text-color: rgb(205, 214, 244);--hover-text-color: rgba(205, 214, 244, .7);--active-text-color: rgba(203, 166, 247, 1);--tab-content-margin: 9px;--searchbar-width: calc(100% - 72px) ;--main-color: rgb(203, 166, 247);--muted: rgb(172, 176, 190);--faded-main-color: rgba(203, 166, 247, .26)}.theme-preset-button{position:relative;padding:.75rem;border-radius:.5rem;border:2px solid;transition:all .2s ease;cursor:pointer}.theme-preset-button:hover{transform:scale(1.05)}.theme-preset-button.active{border-color:var(--main);box-shadow:0 0 0 2px color-mix(in oklab,var(--main) 30%,transparent)}.theme-preset-button:not(.active){border-color:#ffffff1a}.theme-preset-button:not(.active):hover{border-color:#fff3}.theme-preset-colors{display:flex;gap:.25rem}.theme-preset-color-dot{width:.75rem;height:.75rem;border-radius:50%}.theme-preset-info{margin-top:.5rem}.theme-preset-name{font-size:.75rem;font-weight:500;color:var(--text)}.theme-preset-description{font-size:.75rem;color:var(--proto);margin-top:.25rem}.accent-color-button{width:2rem;height:2rem;border-radius:.5rem;border:2px solid var(--white-10);transition:all .2s ease;cursor:pointer}.accent-color-button:hover{border-color:var(--white-20);transform:scale(1.1)}.accent-color-button:active{transform:scale(.95)}.accent-color-button:focus{outline:none;box-shadow:0 0 0 2px var(--main)}.accent-color-button.selected{border-color:var(--main);box-shadow:0 0 0 2px color-mix(in oklab,var(--main) 20%,transparent)}.custom-color-section{transition:opacity .3s ease,max-height .3s ease}.custom-color-section.hidden{opacity:0;max-height:0;overflow:hidden}#themePresetGrid{display:grid;gap:.75rem;grid-template-columns:1fr}@media (min-width: 640px){#themePresetGrid{grid-template-columns:repeat(2,1fr)}}@media (min-width: 768px){#themePresetGrid{grid-template-columns:repeat(3,1fr)}}.colorPicker{display:flex;justify-content:center}#accentColorGrid{display:grid;gap:.5rem;grid-template-columns:repeat(auto-fit,minmax(2rem,1fr))}@media (min-width: 640px){#accentColorGrid{grid-template-columns:repeat(6,1fr)}}.theme-transition{transition:background-color .3s cubic-bezier(.4,0,.2,1),border-color .3s cubic-bezier(.4,0,.2,1),color .3s cubic-bezier(.4,0,.2,1)}@keyframes themePreview{0%{transform:scale(1)}50%{transform:scale(1.02)}to{transform:scale(1)}}.theme-preview-animation{animation:themePreview .4s ease-in-out}.theme-preset-button .theme-colors-preview{display:flex;gap:.25rem;margin-bottom:.5rem}.theme-preset-button .theme-info{text-align:left}.theme-preset-button .theme-name{font-size:.75rem;font-weight:600;color:var(--text);line-height:1.2}.theme-preset-button .theme-description{font-size:.625rem;color:var(--proto);margin-top:.125rem;line-height:1.3;opacity:.8}.click-menu-container{position:fixed;z-index:99999;animation:bc-menu-appear .15s ease-out;font-family:inherit}@keyframes bc-menu-appear{0%{opacity:0;@media (max-width: 768px){.click-menu-container>div{min-width:160px}}.tab-group-header[draggable=true]{cursor:grab}.tab-group-header.dragging-group{opacity:.6;transform:scale(1.02);cursor:grabbing;z-index:1000}.tab-group-header.group-drag-over{background:var(--accent-subtle);transform:scale(1.02)}body.group-dragging .tab-group-header:not(.dragging-group){transition:all .2s ease}body.group-dragging .tab-group-header:not(.dragging-group):hover{background:var(--accent-subtle);transform:scale(1.01)}.group-drop-indicator{position:absolute;left:0;right:0;height:3px;background:var(--accent);border-radius:2px;z-index:1001;animation:pulse-indicator 1s ease-in-out infinite}@keyframes pulse-indicator{0%,to{opacity:.8}50%{opacity:1}}body.group-dragging{-webkit-user-select:none;-moz-user-select:none;user-select:none}transform:scale(.95) translateY(-5px)}to{opacity:1;transform:scale(1) translateY(0)}}.click-menu-container>div{background:var(--bg-1);border:1px solid var(--white-08);border-radius:8px;box-shadow:0 10px 25px #0003,0 0 0 1px var(--white-05);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);min-width:192px;padding:8px}.click-menu-container button{all:unset;display:flex;align-items:center;gap:12px;padding:8px 16px;border-radius:6px;font-size:14px;line-height:1.4;cursor:pointer;transition:all .15s ease;color:var(--text);width:100%;box-sizing:border-box}.click-menu-container button:hover{background:var(--white-05);transform:translateY(-1px)}.click-menu-container button:active{transform:translateY(0)}.click-menu-container button i{color:var(--text-70);transition:color .15s ease}.click-menu-container button:hover i{color:var(--text)}.click-menu-container button.text-red-400{color:#f87171}.click-menu-container button.text-red-400:hover{background:#ef44441a;color:#fca5a5}.click-menu-container button.text-red-400 i{color:#f87171}.click-menu-container button.text-red-400:hover i{color:#fca5a5}.click-menu-container .h-px{height:1px;background:var(--white-08);margin:4px 0}.click-menu-container .group>div:last-child{position:absolute;left:100%;top:0;margin-left:4px;background:var(--bg-1);border:1px solid var(--white-08);border-radius:8px;box-shadow:0 10px 25px #0003,0 0 0 1px var(--white-05);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:8px;opacity:0;visibility:hidden;transform:translate(-4px);transition:all .2s ease;z-index:100000}.click-menu-container .group:hover>div:last-child{opacity:1;visibility:visible;transform:translate(0)}.tab-group-header{position:relative;display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:.75rem;font-size:.875rem;line-height:1.25rem;color:var(--text);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;isolation:isolate;margin:calc(var(--scrollbar-size)) 0 0 0;height:100%}.tab-group-header:hover{color:var(--text);border-color:var(--white-08)}.tab-group-header.collapsed{opacity:.7}.tab-group-header.collapsed:hover{opacity:1}.tab-group-header:before{content:attr(data-tooltip);position:absolute;bottom:100%;left:50%;transform:translate(-50%);background:var(--tooltip-bg);color:var(--text);padding:4px 8px;border-radius:4px;font-size:11px;white-space:nowrap;opacity:0;visibility:hidden;transition:all .2s ease;z-index:1000;border:1px solid var(--tooltip-border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.tab-group-indicator{width:8px;height:8px;border-radius:50%;background:var(--group-color, var(--main));flex-shrink:0}.click-menu-container .group button span.w-4{border:1px solid var(--white-20);transition:all .15s ease}.click-menu-container .group button:hover span.w-4{border-color:var(--white-40);transform:scale(1.1)}.tab-group-header{-webkit-user-select:none;-moz-user-select:none;user-select:none}.tab-group-header:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.tab[data-collapsed=true]{pointer-events:none}.tab[data-group-id]:not([data-collapsed=true]){pointer-events:all}.tab-group-header:active{transform:translateY(0) scale(.98)}.tab-group-header+.click-menu-container{z-index:1001}.tab.drag-ghost{opacity:.6;transform:rotate(2deg);z-index:1000}.tab.ungroup-indicator{border:2px dashed var(--error);background:#f88ba81a;transform:scale(1.02);position:relative}.tab.ungroup-indicator:before{opacity:.3}body.tab-dragging .tab[data-group-id]:first-child:after,body.tab-dragging .tab[data-group-id]:last-child:after{content:"Drop here to ungroup";position:absolute;top:50%;transform:translateY(-50%);background:var(--error);color:#fff;padding:4px 8px;border-radius:4px;font-size:11px;white-space:nowrap;opacity:0;transition:opacity .2s ease;z-index:1001;pointer-events:none}body.tab-dragging .tab[data-group-id]:first-child:after{left:-80px}body.tab-dragging .tab[data-group-id]:last-child:after{right:-80px}body.tab-dragging .tab[data-group-id]:first-child:hover:after,body.tab-dragging .tab[data-group-id]:last-child:hover:after,body.tab-dragging .tab[data-group-id].ungroup-indicator:after{opacity:1}body.tab-dragging .tab[data-group-id]:first-child:before,body.tab-dragging .tab[data-group-id]:last-child:before{content:"";position:absolute;top:0;bottom:0;width:60px;background:#f88ba81a;border:1px dashed var(--error);opacity:0;transition:opacity .2s ease;z-index:999}body.tab-dragging .tab[data-group-id]:first-child:before{left:-60px}body.tab-dragging .tab[data-group-id]:last-child:before{right:-60px}body.tab-dragging .tab[data-group-id].ungroup-indicator:first-child:before,body.tab-dragging .tab[data-group-id].ungroup-indicator:last-child:before{opacity:.7}.tab[data-group-id]{transition:all .3s cubic-bezier(.4,0,.2,1)}.end-ungroup-zone,.start-ungroup-zone{position:relative;min-width:100px;height:36px;background:#f88ba81a;border:2px dashed var(--error);border-radius:6px;display:flex;align-items:center;justify-content:center;transition:all .2s ease;opacity:.7;flex-shrink:0}.end-ungroup-zone{margin-left:8px}.start-ungroup-zone{margin-right:8px}.end-ungroup-zone span,.start-ungroup-zone span{font-size:11px;color:var(--error);font-weight:600;text-align:center;white-space:nowrap;pointer-events:none}.end-ungroup-zone.drag-over,.start-ungroup-zone.drag-over{background:#f88ba84d;transform:scale(1.05);opacity:1}.tab[data-group-id] .tab-title{color:var(--text);text-shadow:0 1px 2px rgba(0,0,0,.1)}@media (max-width: 768px){.click-menu-container>div{min-width:160px}.click-menu-container button{padding:10px 14px;font-size:16px}}.tab[data-group-id] .tab-content{margin-left:6px}.tab[data-collapsed]{animation:tab-hide .2s ease-out forwards}.tab:not([data-collapsed]){animation:tab-show .2s ease-out forwards}@keyframes tab-hide{0%{opacity:1;transform:scaleY(1);height:auto}to{opacity:0;transform:scaleY(0);height:0}}@keyframes tab-show{to{opacity:1;transform:scaleY(1);height:auto}}.tab-group-header.group-drag-over-tab{background:var(--accent-subtle);transform:scale(1.02);box-shadow:0 0 0 2px var(--accent)}.tab-group-drop-indicator{position:absolute;width:3px;top:0;bottom:0;background:var(--accent);border-radius:2px;z-index:1002;animation:pulse-indicator 1s ease-in-out infinite}
