.mac-ie-icon { top: 150px; }
.ie-window {
  position: absolute;
  inset: 28px 0 0;
  z-index: 1;
  display: grid;
  grid-template-rows: 30px 64px 37px minmax(0,1fr) 24px;
  border: 1px solid #242424;
  background: #dedede;
  box-shadow: inset 1px 1px white, inset -1px -1px #777;
}
.ie-titlebar {
  position: relative;
  display: grid;
  place-items: center;
  border-bottom: 1px solid #737373;
  background: repeating-linear-gradient(#f3f3f3 0 2px,#a8a8a8 2px 3px);
  user-select: none;
}
.ie-titlebar strong { padding: 0 9px; background: #e2e2e2; font-size: 16px; }
.ie-close {
  position: absolute;
  left: 8px;
  top: 6px;
  width: 17px;
  height: 17px;
  border: 1px solid #444;
  background: #ddd;
  box-shadow: inset 1px 1px #fff, inset -1px -1px #8c8c8c;
}
.ie-window .ie-titlebar .ie-close { cursor: default; }
.ie-close:active { background: #909090; }
.ie-toolbar {
  display: flex;
  align-items: stretch;
  gap: 3px;
  padding: 4px 7px;
  border-bottom: 1px solid #9c9c9c;
  background: linear-gradient(#f4f4f4,#c8c8c8);
}
.ie-toolbar button {
  width: 72px;
  padding: 2px;
  border: 0;
  background: transparent;
  font-size: 13px;
  color: #5a5a5a;
}
.ie-toolbar svg { display: block; width: 27px; height: 27px; margin: 0 auto 3px; opacity: .65; }
.ie-address {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 9px;
  font-size: 15px;
  border-bottom: 1px solid #777;
}
.ie-address input {
  flex: 1;
  min-width: 0;
  padding: 3px 6px;
  color: #222;
  background: #fff;
  border: 1px solid #777;
  box-shadow: inset 1px 1px #ccc;
  font: inherit;
}
.ie-document {
  min-height: 0;
  margin: 0 2px;
  background: #fff;
}
.ie-document iframe { display: block; width: 100%; height: 100%; border: 0; }
.ie-toolbar button:not(:disabled):hover { background: #fff8; }
.ie-toolbar button:disabled { opacity: .55; }
.ie-status {
  padding: 2px 9px;
  border-top: 1px solid #919191;
  font-size: 13px;
  line-height: 19px;
}

.ie-window-layer { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.ie-window-layer .ie-window { pointer-events: auto; }
.ie-window.ie-secondary { inset: auto; width: 840px; height: 610px; box-shadow: 4px 4px #0005; }
.ie-secondary .ie-titlebar { cursor: move; touch-action: none; }
.ie-external { margin: 24px; }
.ie-window.ie-secondary.ie-archive-window { width: 996px; }

.ie-resize-grip { display: none; }
.ie-secondary .ie-resize-grip {
  display: block;
  position: absolute;
  right: 0;
  bottom: 0;
  width: 16px;
  height: 16px;
  cursor: nwse-resize;
  touch-action: none;
  background: linear-gradient(135deg, transparent 55%, #777 56% 62%, transparent 63% 72%, #777 73% 79%, transparent 80%);
}