:root{--drag-handle-bg: #9C8D78;--dot-bg: #4f4f4f;--draggable-nav-bg: #ffffff18;--a-color: #00000094}body.dark-mode{--drag-handle-bg: #161616;--dot-bg: #b0b0b0;--draggable-nav-bg: #2828284f;--a-color: #ffffff6e}body.dark-mode #draggable-header{box-shadow:0 4px 12px 5px #000}#draggable-header{position:fixed;top:50%;left:10px;transform:translateY(-50%);z-index:1000;cursor:default;display:flex;flex-direction:column;box-shadow:0 4px 12px 5px #00000026;border-radius:8px;transition:all .5s ease-in-out}.drag-handle{width:100%;height:20px;display:flex;justify-content:center;align-items:center;gap:5px;cursor:grab;background-color:var(--drag-handle-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:8px 8px 0 0}.drag-handle .dot{width:6px;height:6px;background-color:var(--dot-bg);border-radius:50%}#draggable-nav{display:flex;flex-direction:column;gap:15px;padding:15px;background-color:var(--draggable-nav-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}#draggable-nav a{display:flex;flex-direction:column;align-items:center;text-decoration:none;color:var(--a-color)}#draggable-nav a:hover{transform:scale(1.1)}#draggable-nav a svg{fill:var(--a-color);transition:fill .2s ease;width:2rem}#draggable-nav a:hover svg{fill:var(--grafic-color-3)}#draggable-nav p{font-size:.8rem!important;margin-top:5px;text-align:center}#draggable-header.is-moving{transition:none}.horizontal-header{flex-direction:row!important;border-radius:0}.horizontal-header #draggable-nav{flex-direction:row;gap:25px;padding:10px 20px}.horizontal-header .drag-handle{flex-direction:column;width:20px;height:68px;border-radius:8px 0 0 8px}.horizontal-header #draggable-nav a{flex-direction:row;align-items:center;gap:8px}.horizontal-header #draggable-nav a p{margin:0;font-size:1em}#draggable-nav a.active-link svg{fill:var(--grafic-color-3)}#draggable-nav a.active-link:hover svg{fill:var(--grafic-color-3)}#draggable-header:not(.horizontal-header) .toggle-button{position:absolute;left:42px;bottom:-62px;right:-20px;width:20px;height:104px;display:flex;justify-content:center;align-items:center;cursor:pointer;background-color:var(--drag-handle-bg);border-radius:0 8px 8px 0;box-shadow:0 2px 5px #0003;transition:transform .3s ease;transform:rotate(90deg);z-index:10}#draggable-header.horizontal-header .toggle-button{position:absolute;top:50%;right:-20px;transform:translateY(-50%);width:20px;height:68px;display:flex;justify-content:center;align-items:center;cursor:pointer;background-color:var(--drag-handle-bg);border-radius:0 8px 8px 0;box-shadow:0 2px 5px #0003;transition:transform .3s ease}#draggable-header.horizontal-header.shrunk{width:50px}#draggable-header.shrunk:not(.horizontal-header){height:50px;width:60px}#draggable-header.horizontal-header.shrunk .toggle-button{transform:translateY(-50%) rotate(180deg);right:0;box-shadow:0 0 0 transparent;border-radius:8px 0 0 8px}#draggable-header.shrunk:not(.horizontal-header) .toggle-button{transform:translate(-50%) rotate(-90deg);bottom:-20px;box-shadow:0 0 0 transparent;border-radius:8px 0 0 8px;height:60px;left:30px}#draggable-header.shrunk #draggable-nav{display:none}@media (max-width: 460px){#draggable-header{position: absolute;}}