/* The original photograph has a white background. Only canvas samples are shown:
   its empty pixels reveal the existing home behind it, without an image box. */
:is(.home-page,.about-page) .home-portrait {
 background: transparent;
 overflow: hidden;
}
:is(.home-page,.about-page) .home-portrait > img,
:is(.home-page,.about-page) .home-portrait > .home-portrait-glasses {
 display: none;
}
:is(.home-page,.about-page) .home-portrait > .portrait-dither {
 display: block;
 position: absolute;
 inset: 0;
 width: 100%;
 height: 100%;
 background: transparent;
}

/* About signature: the supplied frame, in normal flow below the CV links. */
.about-page .about-glasses { width:100%;max-width:560px;margin:42px 0 0;aspect-ratio:860 / 450;pointer-events:none;background:transparent; }
.about-page .about-glasses canvas { display:block;width:100%;height:auto;background:transparent;pointer-events:auto; }
@media(max-width:700px){.about-page .about-glasses{margin:32px 0 36px;max-width:560px}}

/* Three static dither prints float above the existing, full-size portrait. */
.home-page .home-profile-grid > .home-portrait {
 overflow:visible;
 margin-top:76px;
}
.home-page .portrait-tools {
 position:absolute;bottom:calc(100% + 12px);left:12%;width:76%;height:54px;
 display:flex;align-items:center;justify-content:space-between;
 pointer-events:none;z-index:1;
}
.home-page .portrait-tool {
 display:block;width:52px;height:52px;object-fit:contain;
 animation:portrait-tool-float 6s ease-in-out infinite;
 animation-play-state:paused;
}
.home-page .tool-figma { align-self:flex-start;transform:translateY(-8px);animation-delay:-2s; }
.home-page .tool-claude { animation-delay:-4s; }
.home-page .portrait-tools.is-floating .portrait-tool { animation-play-state:running; }
@keyframes portrait-tool-float {
 0%,100% { translate:0 0;rotate:-3deg; }
 50% { translate:0 -6px;rotate:3deg; }
}
@media(max-width:700px){
 .home-page .home-profile-grid > .home-portrait { margin-top:76px; }
 .home-page .portrait-tool { width:48px;height:48px; }
}
@media(prefers-reduced-motion:reduce){
 .home-page .portrait-tool { animation:none; }
}
