html,body{height:100%;overflow:hidden}body{box-sizing:border-box;color:#3d3d3d;--mdc-theme-primary:#007f8b;--mdc-theme-on-primary:#f1f3f4;margin:0;padding:1.25em 2em;font-family:helvetica,arial,sans-serif}h1{color:#007f8b;font-style:italic}h2{clear:both}video{clear:both;display:block;transform:rotateY(180deg)}main{flex-direction:column;height:100%;display:flex;overflow:hidden}#demos{flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden}section{opacity:1;transition:opacity .5s ease-in-out}.tab-row{gap:.75rem;margin:.75rem 0 1rem;display:flex}.tab-button{color:#007f8b;cursor:pointer;background:#fff;border:1px solid #007f8b;border-radius:999px;padding:.45rem .9rem;font-weight:700}.tab-button.active{color:#f1f3f4;background:#007f8b}.invisible{opacity:.2}.videoView,.detectOnClick,.blend-shapes{float:left;width:48%;margin:2% 1%;position:relative}.detectOnClick{cursor:pointer;z-index:0}.detectOnClick img{width:100%;display:block}.videoWrapper{position:relative}.canvas{pointer-events:none;z-index:1;position:absolute;top:0;left:0}.output_canvas{position:absolute;top:0;left:0;transform:rotateY(180deg)}.blend-shapes-item{align-items:center;height:20px;margin-bottom:6px;display:flex}.blend-shapes-label{flex-shrink:0;justify-content:flex-end;align-items:center;width:120px;margin-right:4px;font-size:12px;display:flex}.blend-shapes-value{color:#fff;background-color:#007f8b;align-items:center;min-width:40px;height:16px;padding-left:4px;font-size:12px;display:flex}.blend-shapes-grid{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.blend-shapes-column{margin:0;padding:0;list-style:none}.carousel{align-items:center;gap:.5rem;margin:1rem 0 .25rem;display:flex}.carousel-slot{cursor:pointer;flex:none;position:relative}.carousel-slot img{object-fit:cover;width:480px;height:480px;display:block}.image-loading-overlay{color:#f5fbfd;pointer-events:none;z-index:2;background:#08101673;flex-direction:column;justify-content:center;align-items:center;gap:.55rem;font-size:.92rem;display:flex;position:absolute;inset:0}.image-loading-spinner{border:3px solid #ffffff59;border-top-color:#fff;border-radius:50%;width:2rem;height:2rem;animation:.75s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.carousel-nav{color:#fff;cursor:pointer;background:#007f8b;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:2.4rem;height:2.4rem;font-size:1.6rem;line-height:1;transition:background .15s;display:flex}.carousel-nav:hover{background:#005f6b}.carousel-counter{text-align:center;color:#666;width:calc(480px + 5.8rem);margin:.25rem 0 .5rem;font-size:.85rem}.image-detector-layout{flex:1;align-items:stretch;gap:1.5rem;min-height:0;display:flex;overflow:hidden}.image-col{flex-direction:column;flex-shrink:0;display:flex}.blend-shapes-panel{border-left:2px solid #d0e8ea;flex:1;min-height:0;padding-left:1.25rem;overflow-y:auto}.blend-shapes-panel .blend-shapes{float:none;width:auto;margin:0}.video-shell{margin-top:.75rem}@media (width<=900px){.carousel-slot img{width:100%;height:auto}.carousel-counter{width:100%}.tab-row{flex-wrap:wrap}.videoView,.detectOnClick,.blend-shapes{float:none;width:100%;margin:1.2rem 0}}