/* A slim architectural frame that stays visible as the page scrolls. */
:root {
  --site-frame-width: 12px;
  --site-frame-line: 2px;
}

html {
  background: #fff;
}

body {
  position: relative;
  padding: var(--site-frame-width);
  background: #fff;
}

body::before,
body::after {
  content: '';
  position: fixed;
  pointer-events: none;
  z-index: 1000;
}

body::before {
  inset: 0;
  border: var(--site-frame-width) solid #fff;
}

body::after {
  inset: calc(var(--site-frame-width) - var(--site-frame-line));
  border: var(--site-frame-line) solid #191919;
  border-bottom: 0;
}

@media (max-width: 650px) {
  :root {
    --site-frame-width: 7px;
    --site-frame-line: 1px;
  }
}