/* Bottom navigation v2: a liquid-glass capsule. The current page expands into icon + label,
   a tinted pill glides (and briefly stretches) between items. Routing still belongs to the original buttons. */
body.portfolio-ocean aside.oc-dock.oc-dock-v2{bottom:calc(20px + env(safe-area-inset-bottom));padding:6px;border-radius:999px;background:var(--t-glass,#0a2537d6);box-shadow:0 18px 50px rgba(0,0,0,.18),0 2px 6px rgba(0,0,0,.06),inset 0 1px 0 rgba(255,255,255,.28);backdrop-filter:blur(26px) saturate(1.8);-webkit-backdrop-filter:blur(26px) saturate(1.8)}
html[data-oc-theme=dark] body.portfolio-ocean aside.oc-dock.oc-dock-v2{box-shadow:0 22px 60px rgba(0,0,0,.6),0 0 0 1px rgba(217,183,122,.06),inset 0 1px 0 rgba(255,255,255,.08)}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 nav{gap:2px;align-items:center}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 nav button{flex-direction:row;width:auto;height:48px;min-height:48px;padding:0 14px;gap:0;border-radius:999px;color:var(--dim,#9db9cd);transition:color .25s,padding .4s cubic-bezier(.3,.9,.3,1)}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 nav button .oc-dock-tile{width:auto;height:auto;border:0!important;background:none!important;box-shadow:none!important;transform:none!important;color:inherit;overflow:visible;animation:none}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 nav button .oc-dock-tile:after{display:none}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 nav button .ic svg{width:21px;height:21px;filter:none;transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 nav button:hover{color:var(--text,#e5eff5)}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 nav button:hover .ic svg{transform:translateY(-2px) scale(1.08)}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 nav button:active .ic svg{transform:scale(.9)}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 nav button.dock-active{color:var(--dock-ink,var(--dock-color));padding:0 18px 0 16px}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 .oc-dock-caption{display:inline-block!important;max-width:0;opacity:0;margin-left:0;overflow:hidden;white-space:nowrap;font-size:13px;font-weight:500;letter-spacing:.06em;line-height:1;color:inherit!important;transition:max-width .42s cubic-bezier(.3,.9,.3,1),opacity .3s,margin .42s cubic-bezier(.3,.9,.3,1)}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 nav button.dock-active .oc-dock-caption{max-width:5.5em;opacity:1;margin-left:9px;transition-delay:.05s}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 .oc-dock-tooltip{bottom:calc(100% + 16px);border-radius:999px;padding:6px 12px;font-size:11px}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 nav button.dock-active .oc-dock-tooltip{display:none}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 .oc-dock-divider{height:22px;margin:0 6px;align-self:center}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 nav button.navmore{padding:0 13px}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 .cnt{top:6px;right:6px;min-width:15px;height:15px;padding:0 4px;line-height:15px;text-align:center;font-size:9px;border-radius:999px;box-shadow:0 0 0 2px var(--t-panel-b,#0a2537)}
/* The gliding pill */
body.portfolio-ocean aside.oc-dock.oc-dock-v2 .oc-dock-indicator{left:0;top:6px;bottom:6px;height:auto;width:var(--iw,48px);border-radius:999px;transform:translateX(var(--ix,0px));transition:transform .55s cubic-bezier(.34,1.25,.5,1),width .55s cubic-bezier(.34,1.25,.5,1),scale .3s ease,opacity .3s;scale:1 1}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 .oc-dock-indicator.moving{scale:1.04 .84}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 .oc-dock-indicator:before{content:"";position:absolute;inset:0;left:0;right:0;top:0;bottom:0;height:auto;border-radius:inherit;filter:none;background:linear-gradient(180deg,color-mix(in srgb,var(--t-gold,#d9b77a) 20%,var(--t-panel-b,#16374d)),color-mix(in srgb,var(--t-gold,#d9b77a) 9%,var(--t-panel-b,#16374d)));box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 0 0 1px color-mix(in srgb,var(--t-gold,#d9b77a) 30%,transparent),0 6px 18px color-mix(in srgb,var(--t-gold,#d9b77a) 22%,transparent)}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 .oc-dock-indicator:after{content:"";position:absolute;left:22%;right:22%;bottom:-9px;width:auto;height:10px;margin:0;border-radius:50%;background:radial-gradient(ellipse,color-mix(in srgb,var(--t-gold,#d9b77a) 55%,transparent),transparent 70%);box-shadow:none;filter:blur(3px)}
html[data-oc-theme=dark] body.portfolio-ocean aside.oc-dock.oc-dock-v2 .oc-dock-indicator:before{box-shadow:inset 0 1px 0 rgba(255,255,255,.1),inset 0 0 0 1px color-mix(in srgb,var(--t-gold,#d9b77a) 32%,transparent),0 0 22px color-mix(in srgb,var(--t-gold,#d9b77a) 18%,transparent)}
/* Arrival: items rise in sequence */
.portfolio-ocean.ocean-arriving aside.oc-dock.oc-dock-v2 nav button{animation:ocDockItem .7s cubic-bezier(.2,.9,.3,1.2) both;animation-delay:calc(.35s + var(--dock-order) * .04s)}
@keyframes ocDockItem{from{opacity:0;transform:translateY(12px) scale(.8)}}
@media(max-width:899px){
 body.portfolio-ocean aside.oc-dock.oc-dock-v2{width:min(400px,calc(100vw - 24px));bottom:calc(10px + env(safe-area-inset-bottom));padding:5px;border-radius:30px}
 body.portfolio-ocean aside.oc-dock.oc-dock-v2 nav{justify-content:space-between;gap:0}
 body.portfolio-ocean aside.oc-dock.oc-dock-v2 nav button,body.portfolio-ocean aside.oc-dock.oc-dock-v2 nav button.dock-active,body.portfolio-ocean aside.oc-dock.oc-dock-v2 nav button.navmore{flex:1;flex-direction:column;height:56px;min-height:56px;padding:0;gap:4px;border-radius:25px}
 body.portfolio-ocean aside.oc-dock.oc-dock-v2 .oc-dock-caption,body.portfolio-ocean aside.oc-dock.oc-dock-v2 nav button.dock-active .oc-dock-caption{max-width:none;opacity:1;margin:0;font-size:10px;letter-spacing:.04em}
 body.portfolio-ocean aside.oc-dock.oc-dock-v2 .oc-dock-indicator{top:5px;bottom:5px}
 body.portfolio-ocean aside.oc-dock.oc-dock-v2 .oc-dock-indicator:before{border-radius:25px}
 body.portfolio-ocean aside.oc-dock.oc-dock-v2 .oc-dock-indicator:after{display:none}
 body.portfolio-ocean aside.oc-dock.oc-dock-v2 .cnt{right:calc(50% - 22px);top:4px}
}
@media(prefers-reduced-motion:reduce){body.portfolio-ocean aside.oc-dock.oc-dock-v2 .oc-dock-indicator,body.portfolio-ocean aside.oc-dock.oc-dock-v2 .oc-dock-caption,body.portfolio-ocean aside.oc-dock.oc-dock-v2 nav button{transition:none;animation:none!important}body.portfolio-ocean aside.oc-dock.oc-dock-v2 .oc-dock-indicator.moving{scale:1 1}}
body.portfolio-ocean aside.oc-dock.oc-dock-v2 .cnt:empty{display:none!important}
html[data-oc-theme=light] body.portfolio-ocean aside.oc-dock.oc-dock-v2 .oc-dock-indicator:before{background:linear-gradient(180deg,color-mix(in srgb,var(--t-gold,#b39455) 30%,#fff),color-mix(in srgb,var(--t-gold,#b39455) 16%,#fff));box-shadow:inset 0 1px 0 #fff,inset 0 0 0 1px color-mix(in srgb,var(--t-gold,#b39455) 45%,transparent),0 6px 16px color-mix(in srgb,var(--t-gold,#b39455) 25%,transparent)}