/* macOS-style application tiles with integral artwork and soft depth. */
.robert-os .os-dock,.robert-os .os-dock * {
  -webkit-user-select:none;
  user-select:none;
  -webkit-user-drag:none;
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .robert-os .os-dock > :is(.dock-browser,.dock-terminal,.dock-company,.dock-social),
  .robert-os .os-dock > :is(.dock-browser,.dock-terminal,.dock-company,.dock-social):hover {
    transform:translateX(var(--dock-shift,0px)) scale(var(--dock-scale,1));
    transform-origin:center bottom;
    transition:transform .16s cubic-bezier(.2,.7,.25,1),filter .22s ease;
  }
}
.robert-os .os-dock button:focus,.robert-os .os-dock a:focus {outline:none;}
.robert-os .os-dock button:focus-visible,.robert-os .os-dock a:focus-visible {outline:none;filter:brightness(1.12);}
@media(max-width:600px){body.robert-os{--dock-icon-size:clamp(28px,calc((100vw - 100px)/7),36px);--dock-icon-radius:9px;}}
.robert-os {--dock-space:78px;--dock-icon-size:40px;--dock-icon-radius:11px;}
.robert-os .desktop {padding-bottom:var(--dock-space);}
.robert-os .os-dock {position:fixed;top:auto;left:50%;right:auto;transform:translateX(-50%);z-index:100;gap:12px;padding:8px 12px;bottom:10px;overflow:visible;border:1px solid #ffffff28;border-radius:22px;background:linear-gradient(135deg,#ffffff18,#ffffff07);box-shadow:inset 0 1px 0 #ffffff25,0 8px 28px #00000020;backdrop-filter:blur(24px) saturate(140%);-webkit-backdrop-filter:blur(24px) saturate(140%);}
.robert-os .os-dock button,.robert-os .os-dock .dock-social,.robert-os .os-dock .dock-company {
  box-sizing:border-box;width:var(--dock-icon-size);height:var(--dock-icon-size);min-width:var(--dock-icon-size);max-width:var(--dock-icon-size);min-height:var(--dock-icon-size);max-height:var(--dock-icon-size);aspect-ratio:1;flex:0 0 var(--dock-icon-size);padding:0;border-radius:var(--dock-icon-radius);align-self:center;
  border:1px solid #ffffff24;box-shadow:inset 0 1px 1px #ffffff55,inset 0 -1px 2px #0003,0 3px 5px #0003;
  transition:transform .22s ease,filter .22s ease;
}
.robert-os .os-dock .dock-company {background:transparent;border:0;box-shadow:none;border-radius:var(--dock-icon-radius);overflow:hidden;}
.robert-os .os-dock .dock-company img {display:block;width:var(--dock-icon-size);height:var(--dock-icon-size);min-width:100%;max-width:none;object-fit:cover;}
.robert-os .os-dock .dock-company:hover {background:transparent;filter:brightness(1.12);}
.robert-os .os-dock .dock-social {background:linear-gradient(155deg,#424b61,#1a2337);border:0;border-radius:var(--dock-icon-radius);box-shadow:0 2px 4px #00000024;}
.robert-os .os-dock .dock-social img {display:block;width:calc(var(--dock-icon-size)*.625);height:calc(var(--dock-icon-size)*.625);object-fit:contain;}
.robert-os .os-dock .dock-social[data-tooltip="Instagram"] {background:linear-gradient(35deg,#f5bd63 0%,#ed7354 28%,#ce3d8d 58%,#7d50bd 82%,#5269c6 100%);}
.robert-os .os-dock .dock-social[data-tooltip="LinkedIn"] {background:linear-gradient(145deg,#208fc9,#09629e 65%,#064776);}
.robert-os .os-dock .dock-social[data-tooltip="GitHub"] {background:linear-gradient(145deg,#43464c,#17191d);}
.robert-os .os-dock .dock-browser {background:linear-gradient(145deg,#363636 0%,#191919 48%,#050505 100%);}
.robert-os .os-dock .dock-browser img {display:block;width:calc(var(--dock-icon-size)*.625);height:calc(var(--dock-icon-size)*.625);object-fit:contain;}
.robert-os .os-dock .dock-terminal {display:grid;place-items:center;background:linear-gradient(150deg,#292d29,#080c09 75%);color:#6cf391;font-size:calc(var(--dock-icon-size)*.56);line-height:1;}
@media(max-width:600px){.robert-os{--dock-space:66px;}.robert-os .os-dock{gap:8px;padding:7px 10px;bottom:8px;}.robert-os .os-dock button,.robert-os .os-dock .dock-social,.robert-os .os-dock .dock-company{width:var(--dock-icon-size);height:var(--dock-icon-size);min-width:var(--dock-icon-size);border-radius:var(--dock-icon-radius);}.robert-os .os-dock .dock-social img{width:calc(var(--dock-icon-size)*.625);height:calc(var(--dock-icon-size)*.625);}.robert-os .os-dock .dock-browser img{width:calc(var(--dock-icon-size)*.625);height:calc(var(--dock-icon-size)*.625);}}

/* Dock labels float above the icons without native browser tooltips. */
.robert-os .os-dock [data-tooltip] {position:relative;overflow:visible;}
.robert-os .os-dock .dock-company img {border-radius:var(--dock-icon-radius);}
.robert-os .os-dock [data-tooltip]::after {
  content:attr(data-tooltip);width:max-content;height:28px;max-width:calc(100vw - 24px);box-sizing:border-box;z-index:1;position:absolute;bottom:calc(100% + 10px);left:50%;
  display:grid;place-items:center;text-align:center;
  transform:translate(-50%,4px) scale(calc(1 / var(--dock-scale,1)));transform-origin:center bottom;padding:5px 10px;border:0;border-radius:8px;
  background:linear-gradient(180deg,#292929,#050505);color:#fff;
  font:500 11px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  white-space:nowrap;box-shadow:0 4px 14px #0005;pointer-events:none;
  opacity:0;visibility:hidden;transition:opacity .15s,transform .15s,visibility .15s;
}
@media(hover:hover){.robert-os .os-dock [data-tooltip]:hover::after {opacity:1;visibility:visible;transform:translate(-50%,0) scale(calc(1 / var(--dock-scale,1)));}}
/* Keep every tile on the same bottom-anchored magnification transform,
   including hovered company icons; older hover rules must not replace it. */
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  body.robert-os .os-dock > :is(button,a),
  body.robert-os .os-dock > :is(button,a):hover,
  body.robert-os .os-dock > a.dock-company:hover {
    transform:translateX(var(--dock-shift,0px)) scale(var(--dock-scale,1));
    transform-origin:center bottom;
    transition:transform .16s cubic-bezier(.2,.7,.25,1),filter .22s ease;
  }
}
