.panel-dock-header{height:104px;padding:0 clamp(22px,4vw,68px);display:flex;align-items:center;justify-content:flex-start;position:relative;z-index:40;border-bottom:1px solid rgba(255,255,255,.075);background:linear-gradient(180deg,rgba(7,7,12,.72),rgba(7,7,12,.18));backdrop-filter:blur(14px)}
.panel-dock-brand{position:relative;z-index:3;flex:0 0 auto}.panel-dock-status{position:absolute;right:clamp(22px,4vw,68px);top:82px;display:flex;align-items:center;gap:8px;color:#716d78;font:600 8px/1 ui-monospace,monospace;letter-spacing:.15em}.panel-dock-status i{width:5px;height:5px;border-radius:50%;background:#91e3b4;box-shadow:0 0 13px #66ca91}
.panel-dock{position:absolute;left:auto;right:clamp(22px,4vw,68px);top:11px;transform:perspective(900px) rotateX(1deg);display:flex;align-items:center;gap:4px;padding:7px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:linear-gradient(135deg,rgba(245,243,249,.13),rgba(112,95,180,.075));box-shadow:0 24px 70px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.09);backdrop-filter:blur(30px) saturate(145%);transform-style:preserve-3d;isolation:isolate}
.panel-dock::before{content:"";position:absolute;inset:1px;border-radius:inherit;background:radial-gradient(circle at 32% 0,rgba(171,147,255,.14),transparent 38%);pointer-events:none;z-index:-1}.panel-dock::after{content:"";position:absolute;width:36%;height:180%;left:16%;top:-40%;border:1px solid rgba(157,132,255,.1);border-radius:50%;transform:rotateX(72deg) rotateZ(12deg);pointer-events:none;animation:dockOrbit 13s linear infinite;z-index:-1}
.panel-dock__item{height:52px;min-width:52px;padding:0 15px;display:flex;align-items:center;justify-content:center;gap:9px;position:relative;border-radius:999px;color:#b7b2bf;transition:transform .22s ease,background .22s ease,color .22s ease,box-shadow .22s ease;white-space:nowrap}.panel-dock__item:hover{color:#fff;background:rgba(255,255,255,.075);transform:translateY(-3px) translateZ(18px)}.panel-dock__item:focus-visible{outline:2px solid #af9aff;outline-offset:3px}.panel-dock__item.is-active{min-width:112px;background:#f1f0f3;color:#0a0910;box-shadow:0 10px 32px rgba(0,0,0,.25),inset 0 -1px 0 rgba(0,0,0,.12);transform:translateZ(15px)}
.panel-dock__icon{width:24px;height:24px;display:grid;place-items:center;flex:0 0 auto}.panel-dock__icon svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.panel-dock__label{display:none;font-size:11px;font-weight:750;max-width:116px;overflow:hidden;text-overflow:ellipsis}.panel-dock__item.is-active .panel-dock__label{display:block}.panel-dock__item.is-profile .panel-dock__icon img,.panel-dock__item.is-profile .panel-dock__icon b{width:28px;height:28px;border-radius:50%;object-fit:cover;display:grid;place-items:center;background:linear-gradient(145deg,#9c84ff,#2b214f);color:#fff;font-size:10px;font-weight:700;border:1px solid rgba(255,255,255,.18)}
.panel-dock__badge{position:absolute;right:3px;top:1px;min-width:17px;height:17px;padding:0 4px;display:grid;place-items:center;border:2px solid #17151f;border-radius:999px;background:#9d83ff;color:#fff;font:700 8px/1 Arial,sans-serif}.panel-dock__separator{width:1px;height:24px;margin:0 3px;background:rgba(255,255,255,.11)}.panel-dock__logout{color:#d89aa4}.panel-dock__logout:hover{color:#ffb2bd;background:rgba(255,99,121,.09)}
@keyframes dockOrbit{to{transform:rotateX(72deg) rotateZ(372deg)}}
@media(max-width:1120px){.panel-dock-status{display:none}}
@media(max-width:760px){body.has-panel-dock{padding-bottom:88px}.panel-dock-header{height:68px;padding:0 18px;backdrop-filter:none}.panel-dock{position:fixed;left:12px;right:12px;top:auto;bottom:11px;transform:none;width:auto;justify-content:space-between;padding:6px;box-shadow:0 18px 70px rgba(0,0,0,.62),inset 0 1px 0 rgba(255,255,255,.1)}.panel-dock__item,.panel-dock__item.is-active{height:50px;min-width:0;flex:1;padding:0 9px;transform:none}.panel-dock__label,.panel-dock__item.is-active .panel-dock__label{display:none}.panel-dock__item.is-active{background:#f1f0f3}.panel-dock__item.is-active .panel-dock__icon{color:#09090e}.panel-dock__separator{margin:0}.panel-dock__badge{right:3px}.panel-dock::after{display:none}}
@media(max-width:420px){.panel-dock__item{padding:0 6px}.panel-dock__icon svg{width:21px;height:21px}.panel-dock__separator{display:none}}
@media(prefers-reduced-motion:reduce){.panel-dock::after{animation:none}.panel-dock__item{transition:none}}
