/* v99c: translucent service panel and quiet viewport registration marks. */
#plCard {
  width:var(--study-card-width,384px); padding:60px 24px 24px; border-radius:8px;
  display:grid; grid-template-columns:minmax(0,1fr) 80px; column-gap:16px;
  grid-template-areas:'title icon' 'description description' 'tags tags';
  background:transparent; border:0; box-shadow:none; transition:none; isolation:isolate;
}
#plCard:hover,#plCard.is-pinned { background:transparent; box-shadow:none; border:0; }
#plCard::before,#plCardAccent { display:none; }
#plCard .pl-card-surface {
  position:absolute; inset:0; z-index:-1; pointer-events:none; border-radius:inherit;
  background:rgba(238,241,244,.80); border:1px solid rgba(91,100,112,.14);
  box-shadow:inset 0 1px 0 rgba(246,248,250,.65);
  -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
  -webkit-mask-image:url('assets/panel-corner-v99c.svg'),linear-gradient(#000,#000),linear-gradient(#000,#000);
  mask-image:url('assets/panel-corner-v99c.svg'),linear-gradient(#000,#000),linear-gradient(#000,#000);
  -webkit-mask-size:70.4px 52.8px,100% calc(100% - 52.8px),calc(100% - 70.4px) 52.8px;
  mask-size:70.4px 52.8px,100% calc(100% - 52.8px),calc(100% - 70.4px) 52.8px;
  -webkit-mask-position:top left,bottom left,top right; mask-position:top left,bottom left,top right;
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
  transition:border-color var(--panel-border-ms,0ms) var(--panel-ease,ease-out);
}
#plCard:hover .pl-card-surface,#plCard.is-pinned .pl-card-surface { border-color:rgba(91,100,112,.28); }
#plCard .pl-card-facets { position:absolute; top:0; left:0; width:70.4px; height:52.8px;
  pointer-events:none; fill:var(--graphite-600); }
#plCard .pl-card-facets path { transform-box:fill-box; transform-origin:center; }
#plCard .pl-card-facets path:nth-child(3) { fill:var(--volt); }
#plCardClose { top:10px; right:12px; width:44px; height:44px; border:0;
  background:transparent; border-radius:8px; font-size:18px; }
#plCardClose:hover { background:rgba(198,203,208,.3); color:var(--space-900); }
#plCardClose:focus-visible { outline:2px solid var(--blue); outline-offset:3px; }
#plCardTitle { grid-area:title; align-self:center; margin:0;
  font:800 24px/28px 'Archivo',Arial,sans-serif; letter-spacing:-.02em;
  color:var(--space-900); overflow-wrap:break-word; }
#plCardIcon { grid-area:icon; width:80px; height:80px; margin:0!important; align-self:center; }
#plCardIcon img { display:block; width:80px; height:80px; object-fit:contain; }
#plCardIcon img { filter:brightness(1.025) contrast(1.04) drop-shadow(0 2px 2px rgba(11,14,18,.10)); }
.ic3d img { filter:brightness(1.025) contrast(1.04) drop-shadow(0 6px 12px rgba(11,14,18,.14)); }
#plCardDesc { grid-area:description; margin:16px 0 0;
  font:400 15px/24px 'Inter',Arial,sans-serif; color:var(--space-900); }
#plCardTags { grid-area:tags; display:block; margin:16px 0 0; border-top:1px solid rgba(11,14,18,.12); }
#plCardTags .tag { display:block; padding:8px 0; border:0; border-radius:0;
  background:none; font:500 11px/16px 'JetBrains Mono',Consolas,monospace;
  letter-spacing:.06em; color:var(--graphite-600); text-transform:none; }
#plCardTags .tag + .tag { border-top:1px solid rgba(11,14,18,.12); }
#plOverlay .pl-label::after { transition-duration:var(--study-label-ms,140ms); }
#plViewportFrame { position:absolute; inset:0; z-index:1; pointer-events:none; visibility:hidden; opacity:0; }
#plViewportFrame .pl-frame-corner { position:absolute; width:48px; height:24px; overflow:visible; }
#plViewportFrame .pl-frame-corner path { fill:none; stroke:var(--volt); stroke-opacity:.4;
  stroke-width:1; stroke-linecap:round; stroke-linejoin:round; }
#plViewportFrame .pl-frame-corner polygon { fill:var(--volt); fill-opacity:.65; }
#plViewportFrame .pl-frame-tl { top:max(88px,env(safe-area-inset-top)); left:max(24px,env(safe-area-inset-left)); }
#plViewportFrame .pl-frame-tr { top:max(88px,env(safe-area-inset-top)); right:max(24px,env(safe-area-inset-right)); transform:scaleX(-1); }
#plViewportFrame .pl-frame-bl { bottom:max(24px,env(safe-area-inset-bottom)); left:max(24px,env(safe-area-inset-left)); transform:scaleY(-1); }
#plViewportFrame .pl-frame-br { bottom:max(24px,env(safe-area-inset-bottom)); right:max(24px,env(safe-area-inset-right)); transform:scale(-1); }
html:not(.pl-on) #plViewportFrame { display:none; }
@media (max-width:960px),(pointer:coarse) { #plViewportFrame { display:none; } }
