/* Reserve the page's scrollbar width through modal open/close, avoiding a jump. */
html {scrollbar-gutter:stable;}
/* The portal is a small black opening with a living metal perimeter, not a card. */
.portal-dialog,.portal-dialog.contact-portal {
  --portal-diameter:min(74vw,78svh,680px);
  width:var(--portal-diameter);height:var(--portal-diameter);
  inset:auto;left:50%;top:50%;margin:0;
  max-width:none;max-height:none;aspect-ratio:1;
  padding:0;border:0;border-radius:0;
  overflow:visible;background:transparent;color:var(--ink);
  clip-path:none;box-shadow:none;isolation:isolate;
  opacity:1;transform:translate(-50%,-50%);transition:none;
}
.portal-dialog.is-open {clip-path:none;}
.portal-dialog::backdrop {
  background:#02030459;backdrop-filter:none;
  transition:background 260ms ease-out;
}
/* Static material remains useful when graphics support is unavailable. */
.portal-dialog::before {
  content:"";position:absolute;inset:5.5%;border-radius:48% 51% 49% 50%;
  background:conic-gradient(from 18deg,#1b2028,#a9afb8 6%,#303641 11%,#11151b 18%,#b9bdc3 26%,#686663 30%,#1c2027 38%,#929ba8 45%,#2b3039 49%,#11151b 57%,#d8dbdf 63%,#686e78 68%,#232831 75%,#8e9299 82%,#363c46 87%,#181c23 95%,#1b2028);
  box-shadow:inset 0 1px 1px #e9edf080,inset 0 -3px 5px #000,0 20px 42px #0009;
  opacity:0;transform:scale(.08);transition:transform 520ms cubic-bezier(.16,1,.3,1),opacity 160ms;
  z-index:-2;
}
.portal-dialog::after {
  content:"";position:absolute;inset:14.5%;border-radius:49% 50% 48% 51%;
  background:#010203;box-shadow:0 0 0 2px #303640,0 0 0 5px #090b0e,0 1px 0 6px #89919b;
  opacity:0;transform:scale(.08);transition:transform 520ms cubic-bezier(.16,1,.3,1),opacity 160ms;
  z-index:-1;
}
.portal-dialog.is-open::before {opacity:.6;transform:none;}
.portal-dialog.is-open::after {opacity:1;transform:none;}
.portal-dialog:not(.is-open)::before,.portal-dialog:not(.is-open)::after {transition-duration:260ms,160ms;}
.portal-dialog.has-liquid-canvas::before,.portal-dialog.has-liquid-canvas::after {display:none;}
.liquid-portal-material {
  position:absolute;inset:0;z-index:-1;pointer-events:none;transform:scale(.06);
  transition:transform 520ms cubic-bezier(.16,1,.3,1);
}
.portal-dialog.is-open .liquid-portal-material {transform:none;}
.portal-dialog:not(.is-open) .liquid-portal-material {transition-duration:240ms;}
.portal-filter-defs {position:absolute;pointer-events:none;overflow:hidden;}
.portal-refraction-clip {
  position:absolute;inset:5.5%;pointer-events:none;
  /* Rounded overflow clips the final output without creating the backdrop
     root that a parent mask or clip-path would introduce. The black aperture
     covers the inner disk; this circle clips only the outer lens perimeter. */
  border-radius:50%;overflow:hidden;
}
.portal-refraction {
  position:absolute;inset:-6.18%;pointer-events:none;
  /* The fallback is transparent, lightly frosted glass. Supporting browsers
     displace actual page pixels radially, bounded to this narrow perimeter. */
  -webkit-backdrop-filter:blur(.6px) saturate(1.08);
  backdrop-filter:blur(.6px) saturate(1.08);
  backdrop-filter:var(--portal-refraction-filter) saturate(1.08);
}
.liquid-portal-canvas {position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none;}
.portal-dialog .portal-inner,.contact-portal.portal-dialog .portal-inner {
  height:100%;min-height:0;box-sizing:border-box;
  padding:21% 22% 17%;justify-content:center;
  opacity:0;transform:scale(.96);
  transition:opacity 150ms ease-out,transform 260ms cubic-bezier(.16,1,.3,1);
  pointer-events:none;
}
.portal-dialog.is-open .portal-inner {opacity:1;transform:none;transition-delay:140ms;}
.portal-inner>a,.portal-inner>button,.portal-inner .portal-social,.portal-inner .intent-links {pointer-events:auto;}
.portal-dialog .portal-inner h2 {
  margin:0;font-size:clamp(34px,4.25vw,54px);line-height:1.01;letter-spacing:-.04em;font-weight:400;
  text-wrap:balance;
}
.portal-dialog .portal-inner>p:not(.portal-greeting) {
  margin:16px 0 0;font-size:clamp(13px,1.25vw,16px);line-height:1.5;
  color:#b3b7c0;max-width:32ch;text-wrap:pretty;
}
.portal-dialog .portal-greeting {display:none;}
.portal-dialog .portal-link {margin-top:18px;font-size:14px;min-height:44px;}
.portal-dialog .portal-link .icon {width:15px;height:15px;}
.portal-dialog .portal-social {gap:24px;margin-top:8px;font-size:12px;}
.portal-dialog .portal-social a {display:inline-flex;align-items:center;min-height:44px;}
.portal-dialog .dialog-close {display:none;}
.portal-dialog .intent-links {margin:18px 0 8px;gap:0;}
.portal-dialog .intent-links a {font-size:14px;padding:8px 0;min-height:44px;}
.portal-dialog .intent-links .icon {width:16px;height:16px;}
.portal-dialog .copy-button {font-size:12px;min-height:44px;}
.portal-dialog.is-portal-instant::before,.portal-dialog.is-portal-instant::after,
.portal-dialog.is-portal-instant .portal-inner,.portal-dialog.is-portal-instant .liquid-portal-material {transition:none;}

/* Only an explicit internal link from either aperture starts this route bridge. */
.portal-route-transition {
  position:fixed;inset:0;width:100vw;height:100svh;max-width:none;max-height:none;
  padding:0;margin:0;border:0;background:transparent;overflow:hidden;pointer-events:none;
}
.portal-route-transition::backdrop {background:transparent;}
.portal-route-disk {
  position:absolute;background:#010203;border-radius:50%;transform:translate(-50%,-50%);
  box-shadow:0 0 0 1px #a7b0bd66,0 0 0 5px #343a4444;
  will-change:transform;
}
.portal-dialog.is-route-departing .portal-inner {opacity:0;transition:opacity 140ms ease-out;}
.portal-route-arrival {position:fixed;inset:0;z-index:1000;background:#010203;pointer-events:none;}

@media(max-width:700px) {
  .portal-dialog,.portal-dialog.contact-portal {--portal-diameter:min(106vw,78svh,620px);}
  .portal-dialog .portal-inner,.contact-portal.portal-dialog .portal-inner {padding:22% 23% 16%;}
  .contact-portal.portal-dialog .portal-inner {padding-top:19%;padding-bottom:13%;}
  .portal-dialog .portal-inner h2 {font-size:clamp(31px,7.8vw,48px);}
  .portal-dialog .portal-inner>p:not(.portal-greeting) {font-size:13px;margin-top:12px;}
  .portal-dialog .portal-link {font-size:12px;margin-top:10px;gap:8px;}
  .portal-dialog .portal-social {font-size:11px;margin-top:2px;gap:22px;}
  .portal-dialog .intent-links {margin-top:12px;}
  .portal-dialog .intent-links a {font-size:12px;}
  .portal-dialog .copy-button {font-size:11px;}
}
/* Short viewports keep the black aperture readable, and permit native scrolling. */
@media(max-height:580px) {
  .portal-dialog,.portal-dialog.contact-portal {
    --portal-diameter:min(96vw,600px);height:min(92svh,600px);
    overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;
    scrollbar-width:thin;scrollbar-color:#505761 #010203;
  }
  .portal-dialog .portal-inner,.contact-portal.portal-dialog .portal-inner {
    min-height:360px;height:100%;padding:66px 18% 30px;background:#010203;border-radius:36px;
  }
  .portal-dialog .portal-inner h2 {font-size:38px;}
  .portal-dialog .portal-inner>p:not(.portal-greeting) {font-size:13px;margin-top:10px;}
  .portal-dialog .portal-link {margin-top:10px;}
  .portal-dialog .liquid-portal-material,.portal-dialog::before,.portal-dialog::after {display:none;}
}
@media(prefers-reduced-motion:reduce) {
  .portal-dialog::before,.portal-dialog::after,.portal-dialog .portal-inner,
  .liquid-portal-material {transition:none;}
  .portal-dialog .portal-inner {transform:none;filter:none;}
}
