/* === PATCH v5.1 // new head glitch, centered magnifier, tool popups, folder meta stretch === */

/* access denied popup: align to top frame grid */
.access-denied {
  top: 38px !important;
  right: 132px !important;
}

/* Folder metadata should extend to the right frame edge */
.folder-row {
  grid-template-columns: 22px 1fr minmax(360px, 1.45fr) 84px !important;
}
.folder-row .meta {
  text-align: right;
}
.folder-row .size {
  min-width: 84px !important;
}

/* Magnifier cursor exactly in center, dotted cyan crosshair */
.poster-magnifier {
  transform: translate(-50%, -50%) !important;
  border-color: var(--accent-bright) !important;
}
.poster-magnifier::before,
.poster-magnifier::after {
  background: none !important;
  opacity: .9;
}
.poster-magnifier::before {
  left: 50%;
  top: 0;
  bottom: 0;
  width: 1px;
  background-image: repeating-linear-gradient(
    to bottom,
    rgba(0,234,255,.92) 0 5px,
    transparent 5px 10px
  ) !important;
}
.poster-magnifier::after {
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  background-image: repeating-linear-gradient(
    to right,
    rgba(0,234,255,.92) 0 5px,
    transparent 5px 10px
  ) !important;
}

/* New head reveal idea: pixel-lock / signal focus, no horizontal scan slices */
.hero-side-art.revealed {
  animation: side-art-pixel-lock-v51 .78s steps(8) forwards !important;
}

@keyframes side-art-pixel-lock-v51 {
  0% {
    opacity: 0;
    transform: scale(.965);
    filter: blur(7px) brightness(1.8) contrast(3.6) saturate(.4);
    clip-path: polygon(49% 49%, 51% 49%, 51% 51%, 49% 51%);
  }
  10% {
    opacity: .28;
    transform: scale(1.018);
    filter: blur(4px) brightness(1.45) contrast(4) drop-shadow(0 0 22px rgba(0,234,255,.36));
    clip-path: polygon(28% 18%, 72% 12%, 88% 44%, 74% 82%, 32% 88%, 12% 52%);
  }
  22% {
    opacity: .76;
    transform: scale(.992);
    filter: blur(2px) contrast(3.4) drop-shadow(4px 0 rgba(63,160,255,.55)) drop-shadow(-3px 0 rgba(0,234,255,.45));
    clip-path: polygon(10% 8%, 94% 4%, 98% 74%, 77% 96%, 18% 90%, 2% 36%);
  }
  36% {
    opacity: .42;
    transform: scale(1.012);
    filter: blur(1px) invert(.1) contrast(4.8) brightness(.9);
    clip-path: polygon(0 0, 100% 0, 92% 38%, 100% 100%, 0 100%, 8% 62%);
  }
  50% {
    opacity: .95;
    transform: scale(1.004);
    filter: blur(.4px) contrast(2.2) drop-shadow(3px 0 rgba(90,146,255,.48)) drop-shadow(-3px 0 rgba(0,234,255,.36));
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  }
  64% {
    opacity: .68;
    transform: scale(.998);
    filter: contrast(3.2) brightness(.8);
  }
  78% {
    opacity: .96;
    transform: scale(1.001);
    filter: contrast(1.45) brightness(.94) drop-shadow(0 0 10px rgba(0,234,255,.16));
  }
  100% {
    opacity: .92;
    transform: scale(1);
    filter: contrast(1.05) brightness(.92);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  }
}

/* Click glitch: compact pixel-lock pulse, no scanline cuts */
.hero-side-art.head-click-glitch {
  animation: head-pixel-pulse-v51 .48s steps(6) both !important;
}

@keyframes head-pixel-pulse-v51 {
  0% {
    opacity: .92;
    transform: scale(1);
    filter: contrast(1.05) brightness(.92);
  }
  16% {
    opacity: .72;
    transform: scale(1.006);
    filter: blur(1.2px) brightness(1.25) contrast(3.2) drop-shadow(4px 0 rgba(63,160,255,.55)) drop-shadow(-4px 0 rgba(0,234,255,.42));
    clip-path: polygon(2% 3%, 98% 0, 96% 96%, 6% 100%);
  }
  32% {
    opacity: .96;
    transform: scale(.997);
    filter: invert(.08) contrast(3.8) brightness(.86);
    clip-path: polygon(0 0, 100% 5%, 98% 92%, 3% 100%);
  }
  52% {
    opacity: .54;
    transform: scale(1.003);
    filter: contrast(4.2) brightness(.74);
  }
  74% {
    opacity: .94;
    transform: scale(1.001);
    filter: drop-shadow(2px 0 rgba(63,160,255,.4)) drop-shadow(-2px 0 rgba(0,234,255,.3)) contrast(1.8);
  }
  100% {
    opacity: .92;
    transform: scale(1);
    filter: contrast(1.05) brightness(.92);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  }
}

/* Cyan/blue poster-close glitch override, including the image itself */
.modal.closing {
  filter: drop-shadow(5px 0 rgba(90,146,255,.42)) drop-shadow(-5px 0 rgba(0,234,255,.34)) !important;
}
.modal.closing img,
.poster-hard-glitch {
  animation: poster-cyan-glitch-v51 .52s steps(6) forwards !important;
}
@keyframes poster-cyan-glitch-v51 {
  0% { transform: translate(0,0); filter: contrast(1); clip-path: inset(0); opacity: 1; }
  16% { transform: translate(-5px,1px); filter: contrast(2.5) drop-shadow(5px 0 rgba(90,146,255,.55)); clip-path: inset(0 0 18% 0); }
  32% { transform: translate(5px,-1px); filter: contrast(3) drop-shadow(-5px 0 rgba(0,234,255,.5)); clip-path: inset(22% 0 0 0); }
  48% { transform: translate(-2px,1px); filter: invert(.08) contrast(3.6); clip-path: inset(8% 0 38% 0); }
  68% { transform: translate(2px,0); filter: contrast(4) brightness(1.1); clip-path: inset(50% 0 10% 0); }
  100% { transform: translate(0,0) scale(.985); filter: contrast(5) brightness(.08); clip-path: inset(100% 0 0 0); opacity: 0; }
}

/* Tool icon hover/click feedback */
.tool-icon,
.tool-ai {
  cursor: url("../../refs/New-Cursor-Finger.png") 8 1, pointer;
}
.tool-icon:hover {
  background: rgba(90,146,255,.14);
  box-shadow: 0 0 10px rgba(0,234,255,.16), inset 0 0 0 1px rgba(0,0,0,.45);
}

/* Tooltip window under cursor */
.tool-popover {
  position: fixed;
  z-index: 260;
  display: none;
  width: 230px;
  border: 1px solid rgba(90,146,255,.38);
  background: rgba(8,10,14,.96);
  color: var(--text);
  font-family: var(--pixel-ru);
  font-size: 12px;
  line-height: 1.45;
  padding: 0;
  pointer-events: none;
  box-shadow: 0 0 18px rgba(0,234,255,.12);
}
.tool-popover.show {
  display: block;
  animation: tool-pop-v51 .16s steps(2);
}
.tool-popover .head {
  font-family: var(--pixel-en);
  font-size: 8px;
  color: var(--accent-bright);
  background: var(--text-deep);
  border-bottom: 1px solid rgba(90,146,255,.28);
  padding: 4px 7px;
  letter-spacing: .7px;
}
.tool-popover .body {
  padding: 8px 9px 9px;
}
@keyframes tool-pop-v51 {
  0% { opacity: 0; transform: translate(2px,-2px); filter: contrast(2); }
  100% { opacity: 1; transform: translate(0,0); filter: none; }
}


/* === PATCH v5.2 // careful rollback + alignment fixes === */

/* Access denied: align with the lower edge of the titlebar/menubar frame */
.access-denied {
  top: 42px !important;
  right: 130px !important;
  transform: none !important;
}

/* Restore folder list layout: do not break right columns */
.folder-row {
  grid-template-columns: 22px minmax(220px, .9fr) minmax(420px, 1fr) 84px !important;
}
.folder-row .meta {
  text-align: right !important;
}
.folder-row .size {
  min-width: 84px !important;
  text-align: right !important;
}

/* Magnifier: make cursor sit exactly in crosshair center */
.poster-magnifier {
  width: 308px !important;
  height: 308px !important;
  margin-left: -154px !important;
  margin-top: -154px !important;
  transform: none !important;
}
.poster-magnifier::before {
  left: 50% !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 1px !important;
  background: repeating-linear-gradient(
    to bottom,
    rgba(0,234,255,.95) 0 5px,
    transparent 5px 10px
  ) !important;
}
.poster-magnifier::after {
  top: 50% !important;
  left: 0 !important;
  right: 0 !important;
  height: 1px !important;
  background: repeating-linear-gradient(
    to right,
    rgba(0,234,255,.95) 0 5px,
    transparent 5px 10px
  ) !important;
}

/* Head reveal: same idea, but without glow/halo */
.hero-side-art.revealed {
  animation: side-art-pixel-lock-v52 .62s steps(7) forwards !important;
}

@keyframes side-art-pixel-lock-v52 {
  0% {
    opacity: 0;
    transform: scale(.98);
    filter: blur(3px) brightness(1.12) contrast(2.2) grayscale(.25);
    clip-path: polygon(48% 48%, 52% 48%, 52% 52%, 48% 52%);
  }
  18% {
    opacity: .55;
    transform: scale(1.006);
    filter: blur(1.8px) brightness(1.02) contrast(2.4);
    clip-path: polygon(24% 14%, 76% 12%, 90% 45%, 74% 86%, 30% 88%, 10% 50%);
  }
  36% {
    opacity: .82;
    transform: scale(.996);
    filter: blur(.8px) contrast(2.2);
    clip-path: polygon(8% 6%, 96% 3%, 98% 78%, 78% 97%, 16% 91%, 2% 34%);
  }
  54% {
    opacity: .46;
    transform: scale(1.002);
    filter: contrast(2.8) brightness(.82);
    clip-path: polygon(0 0, 100% 0, 94% 42%, 100% 100%, 0 100%, 6% 60%);
  }
  74% {
    opacity: .9;
    transform: scale(1);
    filter: contrast(1.45) brightness(.9);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  }
  100% {
    opacity: .92;
    transform: scale(1);
    filter: contrast(1.05) brightness(.92);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  }
}

/* Head click: under one second, compact, no glow */
.hero-side-art.head-click-glitch {
  animation: head-pixel-pulse-v52 .36s steps(5) both !important;
}

@keyframes head-pixel-pulse-v52 {
  0% {
    opacity: .92;
    transform: scale(1);
    filter: contrast(1.05) brightness(.92);
  }
  25% {
    opacity: .62;
    transform: scale(1.003);
    filter: blur(.8px) contrast(2.6) brightness(.86);
    clip-path: polygon(2% 3%, 98% 0, 96% 96%, 6% 100%);
  }
  45% {
    opacity: .94;
    transform: scale(.998);
    filter: invert(.05) contrast(2.8) brightness(.82);
    clip-path: polygon(0 0, 100% 4%, 98% 92%, 3% 100%);
  }
  70% {
    opacity: .74;
    transform: scale(1.001);
    filter: contrast(1.9) brightness(.8);
  }
  100% {
    opacity: .92;
    transform: scale(1);
    filter: contrast(1.05) brightness(.92);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  }
}

/* Poster full-screen close glitch: rollback to previous stable variant, only blue/cyan colors */
.modal.closing {
  display: flex !important;
  animation: modal-glitch-out-hard-v52 .52s steps(5) forwards !important;
  filter: none !important;
}
.modal.closing::before {
  background: repeating-linear-gradient(0deg, rgba(90,146,255,.12) 0 1px, transparent 1px 6px) !important;
  animation: modal-scan-cut .52s steps(6) forwards !important;
}
.modal.closing::after {
  background: linear-gradient(90deg,
    transparent 0 12%,
    rgba(0,234,255,.22) 12% 13%,
    transparent 13% 54%,
    rgba(90,146,255,.22) 54% 55%,
    transparent 55%) !important;
  animation: modal-slice-shift .52s steps(5) forwards !important;
}
.modal.closing img,
.poster-hard-glitch {
  animation: poster-hard-glitch-v52 .52s steps(5) forwards !important;
}
@keyframes modal-glitch-out-hard-v52 {
  0% { opacity: 1; filter: none; transform: translate(0,0) scale(1); }
  12% { opacity: 1; filter: contrast(2.1) saturate(1.2); transform: translate(-6px,2px) skew(1deg); }
  24% { opacity: .86; filter: invert(.08) contrast(2.3); transform: translate(7px,-3px) skew(-1deg); }
  44% { opacity: .62; filter: contrast(2.8); transform: translate(-8px,1px) scale(1.006); }
  68% { opacity: .30; filter: contrast(3.4) brightness(1.08); transform: translate(4px,0) scale(.995); }
  100% { opacity: 0; filter: contrast(4) brightness(.2); transform: translate(0,0) scale(.985); }
}
@keyframes poster-hard-glitch-v52 {
  0% { transform: translate(0,0); filter: none; clip-path: inset(0); opacity: 1; }
  15% { transform: translate(-8px,2px); filter: contrast(2.5); clip-path: inset(0 0 18% 0); }
  30% { transform: translate(9px,-3px); filter: invert(.1) contrast(2.8); clip-path: inset(20% 0 0 0); }
  48% { transform: translate(-5px,1px) skew(1deg); filter: hue-rotate(160deg) saturate(1.25); clip-path: inset(8% 0 35% 0); }
  68% { transform: translate(3px,-1px) scale(.99); filter: contrast(3.4) brightness(1.1); clip-path: inset(50% 0 12% 0); }
  100% { transform: translate(0,0) scale(.985); filter: contrast(4) brightness(.1); clip-path: inset(100% 0 0 0); opacity: 0; }
}


/* === PATCH v5.3 // precise requested fixes === */

/* 1. Move access denied window right by roughly half its own width */
.access-denied {
  top: 36px !important;
  right: 134px !important;
  transform: translateX(50%) !important;
}

/* 2. Head click glitch: no horizontal scan/clip slices, only compact signal flicker */
.hero-side-art.head-click-glitch {
  animation: head-signal-flicker-v53 .42s steps(5) both !important;
}

@keyframes head-signal-flicker-v53 {
  0% {
    opacity: .92;
    transform: scale(1);
    filter: contrast(1.05) brightness(.92);
    clip-path: none;
  }
  18% {
    opacity: .55;
    transform: scale(1.004);
    filter: blur(.9px) contrast(2.6) brightness(.78);
    clip-path: none;
  }
  36% {
    opacity: .98;
    transform: scale(.998);
    filter: invert(.06) contrast(2.8) brightness(.86)
      drop-shadow(2px 0 rgba(90,146,255,.4))
      drop-shadow(-2px 0 rgba(0,234,255,.32));
    clip-path: none;
  }
  58% {
    opacity: .68;
    transform: scale(1.002);
    filter: contrast(2.2) brightness(.75);
    clip-path: none;
  }
  100% {
    opacity: .92;
    transform: scale(1);
    filter: contrast(1.05) brightness(.92);
    clip-path: none;
  }
}

/* 3. Poster close glitch: like text/menu glitch, no scanlines, no broken slice mess */
.modal.closing {
  display: flex !important;
  animation: modal-textlike-glitch-v53 .44s steps(5) forwards !important;
  filter: none !important;
}
.modal.closing::before,
.modal.closing::after {
  display: none !important;
}
.modal.closing img,
.poster-hard-glitch {
  animation: poster-textlike-glitch-v53 .44s steps(5) forwards !important;
}

@keyframes modal-textlike-glitch-v53 {
  0% { opacity: 1; transform: translate(0,0); filter: none; }
  20% { opacity: .95; transform: translate(-3px,1px); filter: contrast(1.9); }
  40% { opacity: .82; transform: translate(4px,-1px); filter: contrast(2.4) brightness(1.08); }
  62% { opacity: .48; transform: translate(-2px,0); filter: invert(.06) contrast(2.8); }
  100% { opacity: 0; transform: translate(0,0); filter: contrast(3) brightness(.2); }
}
@keyframes poster-textlike-glitch-v53 {
  0% {
    opacity: 1;
    transform: translate(0,0);
    filter: contrast(1);
  }
  18% {
    opacity: .95;
    transform: translate(-3px,1px);
    filter: contrast(2.2)
      drop-shadow(4px 0 rgba(90,146,255,.55))
      drop-shadow(-4px 0 rgba(0,234,255,.4));
  }
  38% {
    opacity: .8;
    transform: translate(4px,-1px);
    filter: invert(.06) contrast(2.8)
      drop-shadow(3px 0 rgba(90,146,255,.45))
      drop-shadow(-3px 0 rgba(0,234,255,.35));
  }
  64% {
    opacity: .42;
    transform: translate(-2px,0);
    filter: contrast(3.2) brightness(.82);
  }
  100% {
    opacity: 0;
    transform: translate(0,0) scale(.99);
    filter: contrast(3.5) brightness(.15);
  }
}

/* 4. Magnifier: cursor is exact center of square */
.poster-magnifier {
  width: 308px !important;
  height: 308px !important;
  margin-left: -154px !important;
  margin-top: -154px !important;
  transform: none !important;
}

/* 5. Tool popover hover behaviour, anchored to icon */
.tool-popover {
  pointer-events: none !important;
}