/* ============================================
   DOCKET.CSS — Fullscreen, percentage-based
   All positions derived from Figma 1891×1024 frame
   converted to % so they scale to any screen size.
   ============================================ */

body {
  margin: 0;
  padding: 0;
  background: var(--deep-wood, #000);
  overflow: hidden;
  width: 100vw;
  height: 100vh;
}

/* ── Fullscreen container ── */
.docket-layout {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
}

/* ── Background: Figma playbg image + 45% black overlay ── */
.docket-playbg {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
    url('assets/ec35accb116018d275eaa88e46838f95e7b18e10.png') center center / cover no-repeat;
  z-index: 0;
}

/* ── Profile icon  99/1891 = 5.24%  40/1024 = 3.91%  63/1891 = 3.33% ── */
.docket-profile {
  position: absolute;
  left: 5.24%;
  top: 3.91%;
  width: 3.33%;
  aspect-ratio: 1;
  z-index: 10;
  display: block;
}
.docket-profile img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 2px solid var(--brass-dark, #cebe6c);
  object-fit: cover;
  transition: box-shadow 0.2s;
}
.docket-profile img:hover {
  box-shadow: 0 0 14px var(--brass-dark, #cebe6c);
}

/* ── Logo  721/1891 = 38.12%  26/1024 = 2.54%  450/1891 = 23.80% ── */
.docket-logo {
  position: absolute;
  left: 38.12%;
  top: 2.54%;
  width: 23.80%;
  z-index: 10;
  display: block;
}
.docket-logo img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

/* ── FAQ button  1729/1891 = 91.43%  40/1024 = 3.91%  63/1891 = 3.33% ── */
.docket-faq {
  position: absolute;
  left: 91.43%;
  top: 3.91%;
  width: 3.33%;
  aspect-ratio: 1;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
}
.docket-faq img {
  width: 100%;
  height: 100%;
  transition: filter 0.2s;
}
.docket-faq img:hover {
  filter: drop-shadow(0 0 8px var(--brass-dark, #cebe6c));
}

/* ── Folders shared ── */
.docket-folder {
  position: absolute;
  z-index: 10;
  display: block;
  transition: transform 0.22s, filter 0.22s;
}
.docket-folder:hover {
  transform: translateY(-1%) scale(1.03);
  filter: drop-shadow(0 8px 24px rgba(0,0,0,0.7)) brightness(1.08);
}
.docket-folder img {
  width: 100%;
  height: 100%;
  display: block;
  pointer-events: none;
}

/* ── Unsolved Mysteries  379/1891=20.04%  209/1024=20.41%  558/1891=29.51%  674/1024=65.82% ── */
.docket-folder--unsolved {
  left: 20.04%;
  top: 20.41%;
  width: 29.51%;
  height: 65.82%;
}

/* ── Cold Cases  945/1891=49.97%  201/1024=19.63%  579/1891=30.62%  690/1024=67.38% ── */
.docket-folder--cold {
  left: 49.97%;
  top: 19.63%;
  width: 30.62%;
  height: 67.38%;
}