/* Window sidewalls and inner artwork share the existing palette materials. */
.desktop-page .desk-grid {
  perspective: 1800px;
}
body[data-direction="desktop"] .desktop-page [data-desk-window] {
  --object-edge: color-mix(in srgb, var(--desk-surface), var(--desk-ink) 16%);
  rotate: var(--object-rotation, 1 0 0 0deg);
  box-shadow:
    inset 0 1px 0 #ffffff1c,
    0 2px 0 var(--desk-border),
    0 5px 0 var(--object-edge),
    0 6px 0 var(--desk-border),
    0 22px 35px -12px #0006;
  transition:
    transform 0.45s cubic-bezier(0.2, 1.2, 0.3, 1),
    rotate 0.16s ease-out,
    box-shadow 0.25s;
}
body[data-direction="desktop"] .desktop-page [data-object-hover="true"] {
  box-shadow:
    inset 0 1px 0 #ffffff24,
    0 2px 0 var(--desk-border),
    0 6px 0 var(--object-edge),
    0 7px 0 var(--desk-border),
    0 32px 45px -16px #0008;
}
.desk-game-preview .game-video {
  transform: scale(1.055);
  translate: calc(var(--object-x, 0) * -6px) calc(var(--object-y, 0) * -5px);
  transition: translate 0.16s ease-out;
}
.desk-game-preview .game-caption {
  translate: calc(var(--object-x, 0) * 3px) calc(var(--object-y, 0) * 2px);
  transition: translate 0.16s ease-out;
}
body[data-direction="desktop"] .desktop-page [data-desk-window].is-dragging,
body[data-direction="desktop"]
  .desktop-page
  [data-desk-window].window-transitioning {
  rotate: none;
  transition: none;
}
body[data-motion="off"] .desktop-page [data-desk-window] {
  rotate: none;
}
body[data-motion="off"] .desk-game-preview :is(.game-video, .game-caption) {
  translate: none;
  transition: none;
}
/* A passive, top-layer paper preview: the original anchor remains the download. */
.desk-resume-preview {
  margin: 0;
  padding: 9px 9px 0;
  border: 0;
  overflow: visible;
  background: transparent;
  color: var(--desk-ink);
  pointer-events: none;
  opacity: 0;
  transform: translateY(-8px) rotate(-3deg) scale(0.94);
  transform-origin: 50% 0;
  transition:
    opacity 0.18s,
    transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}
.desk-resume-preview[data-open="true"] {
  opacity: 1;
  transform: translateY(0) rotate(1deg) scale(1);
}
.resume-paper {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 773 / 1000;
  perspective: 800px;
  filter: drop-shadow(0 18px 22px #0005);
}
.resume-paper > i {
  position: absolute;
  left: 0;
  width: 100%;
  height: 33.334%;
  background: #fff url("./assets/resume-preview.png") no-repeat;
  background-size: 100% 300%;
  transform-origin: center top;
  backface-visibility: hidden;
  box-shadow: inset 0 -1px #17282520;
  transition: transform 0.55s cubic-bezier(0.16, 1, 0.3, 1);
}
.resume-paper > i:nth-child(1) {
  top: 0;
  background-position: center top;
  transform: rotateX(-35deg);
}
.resume-paper > i:nth-child(2) {
  top: 33.333%;
  background-position: center center;
  transform: rotateX(-105deg);
  transition-delay: 0.08s;
}
.resume-paper > i:nth-child(3) {
  top: 66.666%;
  background-position: center bottom;
  transform: rotateX(-110deg);
  transition-delay: 0.16s;
}
.desk-resume-preview[data-open="true"] .resume-paper > i {
  transform: rotateX(0);
}
.resume-preview-caption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 8px 10px;
  border: 1px solid var(--desk-border);
  background: var(--desk-surface);
  border-radius: 0 0 8px 8px;
  font:
    8px "IBM Plex Mono",
    monospace;
}
.resume-preview-caption b {
  font-size: 16px;
  color: var(--desk-accent);
  font-weight: 400;
}
[data-resume-preview] .social-tooltip {
  display: none;
}
@media (max-width: 850px) {
  body[data-direction="desktop"] .desktop-page [data-desk-window] {
    rotate: none;
    box-shadow:
      inset 0 1px 0 #ffffff1c,
      0 2px 0 var(--desk-border),
      0 4px 0 var(--object-edge),
      0 20px 30px -15px #0005;
  }
}
body[data-motion="off"] .desk-resume-preview,
body[data-motion="off"] .resume-paper > i {
  transition: none;
}
@media (prefers-reduced-motion: reduce) {
  body[data-direction="desktop"] .desktop-page [data-desk-window] {
    rotate: none;
    transition: none;
  }
  .desk-game-preview :is(.game-video, .game-caption) {
    translate: none;
    transition: none;
  }
  .desk-resume-preview,
  .resume-paper > i {
    transition: none;
  }
}