@property --ub-f1{syntax:'<length>';inherits:false;initial-value:0px}
@property --ub-f2{syntax:'<length>';inherits:false;initial-value:0px}
.ub-dock{--ub-size:80px;--ub-h:100px;--ub-icon:46px;--ub-img:28px;--ub-font:11px;--ub-gap:10px;--ub-radius:16px;--ub-pad-x:24px;--ub-pad-y:24px;--ub-fade:22px;--ub-primary:#084387;--ub-primary-2:#0d63c4;--ub-primary-rgb:8,67,135;--ub-accent:#38bdf8;--ub-accent-rgb:56,189,248;--ub-badge-color:#ef4444;--ub-center-shift:0px;--ub-card:#fff;--ub-card-2:#f8fafc;--ub-card-rgb:255,255,255;--ub-card-2-rgb:248,250,252;--ub-text:#3f4064;--ub-border:rgba(15,23,42,.09);--ub-border-hover:rgba(8,67,135,.28);--ub-theme-opacity:1;--ub-blur:0px;--ub-shadow:.12;--ub-ease:cubic-bezier(.22,.61,.36,1);direction:rtl;display:block;width:100%;margin:0;padding:0;box-sizing:border-box;font-family:inherit;left:var(--ub-center-shift,0px)}
.ub-dock *,.ub-dock *::before,.ub-dock *::after{box-sizing:border-box}
.ub-dock__viewport{position:relative;width:100%;min-width:0}
.ub-dock__track{--ub-f1:0px;--ub-f2:0px;position:relative;display:flex;width:100%;min-width:0;align-items:stretch;justify-content:center;gap:var(--ub-gap);margin:0;padding:var(--ub-pad-y) var(--ub-pad-x);list-style:none;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;overscroll-behavior-x:contain;cursor:grab;transition:--ub-f1 .18s linear,--ub-f2 .18s linear;-webkit-mask-image:linear-gradient(to left,transparent 0,#000 var(--ub-f1),#000 calc(100% - var(--ub-f2)),transparent 100%);mask-image:linear-gradient(to left,transparent 0,#000 var(--ub-f1),#000 calc(100% - var(--ub-f2)),transparent 100%)}
.ub-dock__track::-webkit-scrollbar{display:none}
.ub-dock:not(.is-static):not(.is-start) .ub-dock__track{--ub-f1:var(--ub-fade)}
.ub-dock:not(.is-static):not(.is-end) .ub-dock__track{--ub-f2:var(--ub-fade)}
.ub-dock.is-snap .ub-dock__track{scroll-snap-type:x proximity}
.ub-dock.is-static .ub-dock__track{cursor:default}
.ub-dock__track.is-dragging{cursor:grabbing;scroll-snap-type:none}
.ub-dock__track.is-dragging .ub-item{pointer-events:none}
.ub-cell{flex:0 0 auto;display:flex;scroll-snap-align:center;margin:0;padding:0;list-style:none}
.ub-cell::marker{content:''}
.ub-cell:first-child{margin-inline-start:auto}
.ub-cell:last-child{margin-inline-end:auto}
.ub-item{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:var(--ub-size);min-height:var(--ub-h);padding:8px 4px;border-radius:var(--ub-radius);border:1px solid var(--ub-border);background:linear-gradient(170deg,rgba(var(--ub-card-rgb),var(--ub-theme-opacity)) 0,rgba(var(--ub-card-2-rgb),var(--ub-theme-opacity)) 100%);box-shadow:0 8px 20px rgba(15,23,42,var(--ub-shadow)),inset 0 1px 0 rgba(255,255,255,.75);-webkit-backdrop-filter:blur(var(--ub-blur));backdrop-filter:blur(var(--ub-blur));text-decoration:none!important;overflow:visible;isolation:isolate;-webkit-tap-highlight-color:transparent;transition:transform .28s var(--ub-ease),border-color .28s var(--ub-ease)}
@media (hover:hover){.ub-item:hover{transform:translate3d(0,-2px,0);border-color:var(--ub-border-hover)}
.ub-item:hover .ub-icon{transform:translate3d(0,-1px,0) rotate(-2deg)}
.ub-item:hover .ub-icon img,.ub-item:hover .ub-icon svg{transform:scale(1.06)}
.ub-item:hover .ub-icon::before{opacity:.9;transform:scale(1.12)}}
.ub-item:active{transform:scale(.965)}
.ub-item:focus-visible{outline:2px solid var(--ub-primary-2);outline-offset:2px}
.ub-icon::before{content:'';position:absolute;top:-24px;left:50%;width:66px;height:66px;margin-left:-33px;border-radius:50%;background:radial-gradient(circle,rgba(var(--ub-primary-rgb),.3),rgba(var(--ub-primary-rgb),0) 68%);opacity:.45;z-index:-1;pointer-events:none;transition:opacity .3s var(--ub-ease),transform .45s var(--ub-ease)}
.ub-item::before{content:'';position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;border-radius:inherit;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.5) 50%,transparent 65%);transform:translate3d(-120%,0,0)}
.ub-icon{position:relative;z-index:1;width:var(--ub-icon);height:var(--ub-icon);display:flex;align-items:center;justify-content:center;border-radius:13px;background:#fff;box-shadow:inset 0 0 0 1px rgba(15,23,42,.06);transition:transform .35s var(--ub-ease),background .3s var(--ub-ease)}
.ub-icon img{width:var(--ub-img);height:var(--ub-img);object-fit:contain;display:block;transition:transform .35s var(--ub-ease)}
.ub-icon svg{width:var(--ub-img);height:var(--ub-img);display:block;color:var(--ub-primary);transition:transform .35s var(--ub-ease),color .3s var(--ub-ease)}
.ub-icon__fallback{font-size:calc(var(--ub-img)*.55);font-weight:900;color:var(--ub-primary);line-height:1}
.ub-text{position:relative;z-index:1;font-size:var(--ub-font);font-weight:800;line-height:1.3;color:var(--ub-text);text-align:center;letter-spacing:-.2px;transition:color .28s var(--ub-ease),opacity .2s linear}
.ub-item.is-active{background:linear-gradient(155deg,var(--ub-primary-2) 0,var(--ub-primary) 78%);border-color:transparent;box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
.ub-item.is-active .ub-text{color:#fff}
.ub-item.is-active .ub-icon{background:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.9)}
.ub-item.is-active .ub-icon::before{background:radial-gradient(circle,rgba(var(--ub-accent-rgb),.55),rgba(var(--ub-accent-rgb),0) 68%);opacity:.9}
.ub-dock.is-live .ub-item.is-active::before{opacity:1;animation:ubShine 2.8s var(--ub-ease) .4s infinite}
@keyframes ubShine{0%{transform:translate3d(-120%,0,0)}55%,100%{transform:translate3d(120%,0,0)}}
.ub-badge{position:absolute;top:6px;inset-inline-start:6px;z-index:4;display:flex;align-items:center;justify-content:center;min-width:17px;height:17px;padding:0 5px;border-radius:99px;background:var(--ub-badge-color,#ef4444);color:#fff;font-size:9px;font-weight:900;line-height:1;pointer-events:none}
.ub-badge.is-dot{width:8px;min-width:0;height:8px;padding:0}
.ub-item[data-badge] .ub-badge:not(.is-dot){top:-4px;inset-inline-start:-4px;height:20px;padding:1px 8px;border:1px solid rgba(255,255,255,.94);border-radius:7px 4px 7px 4px;box-shadow:0 4px 10px rgba(15,23,42,.24);transform:rotate(8deg);transform-origin:top right}
.ub-item[data-pulse="1"]::after{content:'';position:absolute;inset:0;border-radius:inherit;border:1.5px solid var(--ub-badge-color,#ef4444);z-index:2;pointer-events:none;opacity:0}
.ub-dock.is-live .ub-item[data-pulse="1"]::after{animation:ubPulse 2.4s ease-in-out infinite}
.ub-item[data-pulse="1"].is-active::after{border-color:var(--ub-badge-color,#ef4444)}
@keyframes ubPulse{0%,100%{opacity:0}50%{opacity:1}}
.ub-ripple{position:absolute;z-index:5;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(8,67,135,.26),transparent 70%);transform:scale(0);animation:ubRipple .6s ease-out forwards}
.ub-item.is-active .ub-ripple{background:radial-gradient(circle,rgba(255,255,255,.42),transparent 70%)}
@keyframes ubRipple{to{transform:scale(2.6);opacity:0}}
.ub-nav{position:absolute;top:50%;transform:translate3d(0,-50%,0);z-index:6;display:none;width:30px;height:30px;padding:0;align-items:center;justify-content:center;border:1px solid var(--ub-border);border-radius:50%;background:rgba(255,255,255,.92);color:var(--ub-primary);cursor:pointer;opacity:0;transition:opacity .25s var(--ub-ease),background .2s linear,transform .2s var(--ub-ease)}
.ub-nav svg{width:16px;height:16px;display:block}
.ub-nav--prev{inset-inline-start:2px}
.ub-nav--next{inset-inline-end:2px}
.ub-nav:hover{background:#fff;transform:translate3d(0,-50%,0) scale(1.08)}
.ub-nav:focus-visible{opacity:1;outline:2px solid var(--ub-primary-2);outline-offset:2px}
@media (min-width:768px) and (hover:hover){.ub-dock:not(.is-static) .ub-nav{display:flex}
.ub-dock:not(.is-static):hover .ub-nav{opacity:1}
.ub-dock.is-start .ub-nav--prev,.ub-dock.is-end .ub-nav--next{opacity:0!important;pointer-events:none}}
.ub-dock__bar{position:absolute;bottom:0;left:50%;transform:translate3d(-50%,0,0);width:40px;height:2px;border-radius:99px;background:rgba(15,23,42,.1);overflow:hidden;opacity:1;transition:opacity .3s ease;pointer-events:none}
.ub-dock.is-static .ub-dock__bar{opacity:0}
.ub-dock__bar i{display:block;height:100%;width:40%;border-radius:99px;background:linear-gradient(90deg,var(--ub-primary-2),var(--ub-accent));will-change:transform}
.ub-cell{animation:ubIn .45s var(--ub-ease) both}
.ub-cell:nth-child(1){animation-delay:.02s}
.ub-cell:nth-child(2){animation-delay:.07s}
.ub-cell:nth-child(3){animation-delay:.12s}
.ub-cell:nth-child(4){animation-delay:.17s}
.ub-cell:nth-child(5){animation-delay:.22s}
.ub-cell:nth-child(6){animation-delay:.27s}
@keyframes ubIn{from{opacity:0;transform:translate3d(0,8px,0) scale(.96)}to{opacity:1;transform:none}}
@media (min-width:768px){.ub-dock{--ub-size:88px;--ub-h:106px;--ub-icon:50px;--ub-img:30px;--ub-font:12px}}
.ub-dock[data-theme="glass"]{--ub-primary:#4a9387;--ub-primary-2:#345e58;--ub-primary-rgb:74,147,135;--ub-accent:#a9c8b5;--ub-accent-rgb:169,200,181;--ub-card:#f4f6ed;--ub-card-2:#e7eddf;--ub-card-rgb:244,246,237;--ub-card-2-rgb:231,237,223;--ub-text:#345e58;--ub-border:rgba(52,94,88,.14);--ub-border-hover:rgba(74,147,135,.42)}
.ub-dock[data-theme="ocean"]{--ub-primary:#209daf;--ub-primary-2:#0b3745;--ub-primary-rgb:32,157,175;--ub-accent:#75d1d8;--ub-accent-rgb:117,209,216;--ub-card:#e8f7f8;--ub-card-2:#d5eef0;--ub-card-rgb:232,247,248;--ub-card-2-rgb:213,238,240;--ub-text:#0b3745;--ub-border:rgba(11,55,69,.14);--ub-border-hover:rgba(32,157,175,.42)}
.ub-dock[data-theme="night"]{--ub-primary:#9c7be8;--ub-primary-2:#514071;--ub-primary-rgb:156,123,232;--ub-accent:#c7b5ff;--ub-accent-rgb:199,181,255;--ub-card:#382b55;--ub-card-2:#241d36;--ub-card-rgb:56,43,85;--ub-card-2-rgb:36,29,54;--ub-text:#f0eaff;--ub-border:rgba(220,204,255,.18);--ub-border-hover:rgba(156,123,232,.56)}
.ub-dock[data-theme="sunset"]{--ub-primary:#d87352;--ub-primary-2:#633b3c;--ub-primary-rgb:216,115,82;--ub-accent:#f2b06a;--ub-accent-rgb:242,176,106;--ub-card:#fff0df;--ub-card-2:#f8dfc8;--ub-card-rgb:255,240,223;--ub-card-2-rgb:248,223,200;--ub-text:#633b3c;--ub-border:rgba(99,59,60,.14);--ub-border-hover:rgba(216,115,82,.42)}
@media (prefers-color-scheme:dark){.ub-dock{--ub-card:#111827;--ub-card-2:#0b1220;--ub-card-rgb:17,24,39;--ub-card-2-rgb:11,18,32;--ub-text:#e5e7eb;--ub-border:rgba(148,163,184,.18);--ub-border-hover:rgba(56,189,248,.4)}
.ub-item{box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.ub-icon{background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.ub-icon svg{color:#7dd3fc}
.ub-icon__fallback{color:#e5e7eb}
.ub-item.is-active .ub-icon{background:#fff}
.ub-item.is-active .ub-icon svg{color:var(--ub-primary)}
.ub-dock__bar{background:rgba(148,163,184,.18)}
.ub-nav{background:rgba(17,24,39,.9);color:#e5e7eb}
.ub-nav:hover{background:#111827}}
.ub-dock__viewport{isolation:isolate}
.ub-skel{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;gap:var(--ub-gap);padding:var(--ub-pad-y) var(--ub-pad-x);overflow:hidden;transition:opacity .25s ease;pointer-events:none}
.ub-skel__cell{flex:0 0 auto;width:var(--ub-size);height:var(--ub-h);border-radius:var(--ub-radius);background:linear-gradient(100deg,rgba(15,23,42,.06) 30%,rgba(15,23,42,.13) 45%,rgba(15,23,42,.06) 60%);background-size:250% 100%;animation:ubShimmer 1.3s ease infinite}
@keyframes ubShimmer{0%{background-position:120% 0}100%{background-position:-20% 0}}
.ub-dock__track{opacity:0;transition:opacity .3s ease;animation:ubForceShow 0s 2.5s forwards}
.ub-dock.is-ready .ub-dock__track{opacity:1}
.ub-dock.is-ready .ub-skel{opacity:0}
@keyframes ubForceShow{to{opacity:1}}
.ub-dock:not(.is-ready) .ub-skel{animation:ubForceHide 0s 2.5s forwards}
@keyframes ubForceHide{to{opacity:0;pointer-events:none}}
.ub-dock--no-anim .ub-cell{animation:none!important;opacity:1!important;transform:none!important}
.ub-dock--no-nav .ub-nav{display:none!important}
.ub-dock[data-mode="static"] .ub-dock__track{overflow-x:visible;flex-wrap:wrap;justify-content:center;-webkit-mask-image:none;mask-image:none}
.ub-dock[data-mode="static"] .ub-cell{margin-inline:0}
.ub-dock.is-static .ub-dock__track{overflow-x:hidden;-webkit-mask-image:none;mask-image:none}
.ub-dock.is-static .ub-cell{margin-inline:0}
.ub-dock[data-mode="static"] .ub-nav,.ub-dock[data-mode="static"] .ub-dock__bar{display:none!important}
.ub-dock--sticky{position:sticky;top:0;z-index:500;background:var(--ub-card, #fff)}
.ub-dock__close{position:absolute;top:2px;inset-inline-end:2px;z-index:6;display:flex;align-items:center;justify-content:center;width:22px;height:22px;padding:0;border:1px solid var(--ub-border);border-radius:50%;background:rgba(255,255,255,.92);color:var(--ub-text);cursor:pointer;opacity:.75;transition:opacity .2s ease,background .2s ease}
.ub-dock__close:hover,.ub-dock__close:focus-visible{opacity:1;background:#fff}
.ub-dock--dismissible.ub-dock--closed{max-height:0;min-height:0;overflow:hidden;margin:0;border:0;opacity:0;pointer-events:none;transition:opacity .2s ease,max-height .3s ease}
@media (prefers-color-scheme:dark){.ub-skel__cell{background:linear-gradient(100deg,rgba(255,255,255,.05) 30%,rgba(255,255,255,.12) 45%,rgba(255,255,255,.05) 60%);background-size:250% 100%}
.ub-dock--sticky{background:var(--ub-card,#111827)}
.ub-dock__close{background:rgba(17,24,39,.9);color:#e5e7eb}
.ub-dock__close:hover,.ub-dock__close:focus-visible{background:#111827}}
@media (prefers-reduced-motion:reduce){.ub-dock *,.ub-dock *::before,.ub-dock *::after{animation:none!important;transition-duration:.01ms!important}
.ub-dock__track{opacity:1}
.ub-skel{display:none}}

/* Compact cards keep their icon frame intact and clamp labels as item counts grow. */
.ub-dock .ub-item{gap:3px;padding:3px 4px 6px}
.ub-dock .ub-text{display:-webkit-box;min-width:0;max-width:100%;margin-bottom:2px;overflow:hidden;overflow-wrap:anywhere;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-height:1.15}
.ub-loading{position:absolute;right:12px;bottom:3px;left:12px;height:2px;overflow:hidden;border-radius:99px;background:rgba(var(--ub-primary-rgb),.14);opacity:0;transform:scaleX(.7);transition:opacity .2s ease,transform .25s ease;pointer-events:none}
.ub-loading::before{content:"";position:absolute;inset:0 auto 0 0;width:36%;border-radius:inherit;background:linear-gradient(90deg,transparent,var(--ub-primary-2),var(--ub-accent),transparent);box-shadow:0 0 9px rgba(var(--ub-primary-rgb),.32);transform:translateX(280%)}
.ub-item.is-loading .ub-loading{opacity:1;transform:scaleX(1)}
.ub-item.is-loading .ub-loading::before{animation:ubLoadingSweep .9s cubic-bezier(.4,0,.2,1) infinite}
.ub-item.is-loading .ub-text{opacity:.82}
@keyframes ubLoadingSweep{to{transform:translateX(-280%)}}
@media (prefers-color-scheme:dark){.ub-loading{background:rgba(255,255,255,.18)}.ub-loading::before{box-shadow:0 0 9px rgba(var(--ub-accent-rgb),.42)}}
@media (prefers-reduced-motion:reduce){.ub-item.is-loading .ub-loading::before{width:100%;transform:none;animation:none}}
