/* Base */
html, body {
  height: 100%;
  margin: 0;
  overflow: hidden;
  font-family: "IM Fell English", serif;
  cursor: url('/Asylum/Assets/pencilcursor.png') 6 24, auto; /* <- corrected path */
}

/* Room background — corrected to /Asylum/Assets/... */
.scene.brenna-room{
  position: fixed;
  inset: 0;
  background:
    url("/Asylum/Assets/Brenna-Room-Background.png")
    center/cover no-repeat;
  z-index: 0;
}

/* Sprite */
.brenna-sprite{
  position: absolute;
  bottom: 0;
  left: 14%;
  height: 78%;
  user-select: none;
  -webkit-user-drag: none;
  cursor: grab;
  z-index: 10;
  touch-action: none;
}
.brenna-sprite.dragging{ cursor: grabbing; }

/* Dialogue modal */
.dlg{ position:fixed; inset:0; display:none; place-items:center;
      background: radial-gradient(120% 120% at 50% 50%, rgba(0,0,0,.08), rgba(0,0,0,.6));
      z-index: 30; }
.dlg[aria-hidden="false"]{ display:grid; }

.dlg-paper{
  position:relative;
  width:min(720px, 92vw);
  padding:18px 20px 16px;
  color:#2b2b2b;
  background:
    linear-gradient(rgba(255,255,255,.88), rgba(255,255,255,.88)),
    url('https://www.shutterstock.com/image-vector/seamless-pattern-thin-bow-knots-600nw-2562784749.jpg');
  background-size:260px auto;
  border:2px solid #c9b89f;
  box-shadow:8px 10px 0 rgba(0,0,0,.45);
  transform:rotate(-.6deg);
}
.dlg-close{ position:absolute; top:8px; right:10px; border:0; background:transparent; font-size:18px; cursor:pointer; }
.dlg-line{ font-size:clamp(18px,2.3vw,22px); line-height:1.45; margin:6px 4px 12px; }
.dlg-choices{ display:grid; gap:10px; }
.dlg-choices .choice{
  padding:.55rem .85rem; background:#fffdf6; border:2px solid #cbbca1;
  box-shadow:3px 3px 0 rgba(0,0,0,.35); transform:rotate(-.4deg);
  font-family:"IM Fell English",serif; cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease;
}
.dlg-choices .choice:hover{ transform:translate(-2px,-2px) rotate(-.4deg); box-shadow:5px 5px 0 rgba(0,0,0,.45); }

/* Back button */
.back-btn{
  position:absolute; right:18px; top:18px;
  padding:8px 12px; background:#fff8f9; border:2px solid #008000;
  border-radius:6px; cursor:pointer; z-index:12;
}
.back-btn:hover{ transform: translateY(-2px); }

/* (Inventory styles come from inventory.css) */
.computer {
  position: absolute;
  left: 72.5%;   /* adjust placement */
  top: 36%;    /* adjust placement */
  width: 120px;
  height: 100px;
  display: block;
  background: transparent;/* clickable but invisible */
}
.poster{
  position: absolute;
  /* poster” position-lobby */
  left: 100%;
  top: 10%;
  width: 100px;
  height: auto;
  transform: rotate(-3deg);
  filter: drop-shadow(0 6px 10px rgba(0,0,0,.45));
  cursor: pointer;
  z-index: 2;
  transition: transform .15s ease;
}
.poster:hover{ transform: rotate(-2deg) scale(1.02); }

/* Modal */
.poster-modal{
  position: fixed; inset: 0; display: none; place-items: center;
  background: radial-gradient(120% 120% at 50% 50%, rgba(0,0,0,.15), rgba(0,0,0,.65));
  z-index: 999;
}
.poster-modal[aria-hidden="false"]{ display: grid; }

/* Paper frame around poster */
.poster-paper{
  position: relative;
  width: min(760px, 94vw);
  padding: 16px;
  background: #f4efe6;
  border: 2px solid #c9b89f;
  box-shadow: 8px 10px 0 rgba(0,0,0,.45);
  transform: rotate(-.6deg);
  background-image:
    radial-gradient(transparent 60%, rgba(0,0,0,.05) 61%),
    url("https://www.transparenttextures.com/patterns/paper-fibers.png");
  background-blend-mode: multiply;
  clip-path: polygon(
    4% 3%, 96% 2%, 98% 18%, 95% 36%, 99% 51%,
    96% 67%, 98% 84%, 95% 97%, 6% 98%, 3% 82%,
    5% 66%, 2% 49%, 4% 31%, 2% 15%
  );
}
.poster-paper img{
  display:block; width: 10%; height: auto; border:1px solid rgba(0,0,0,.12);
}
.poster-paper p{
  margin:.6rem .25rem 0;
  font-family:"IM Fell English","Times New Roman",serif;
  color:#2b2b2b; text-align:center;
}
.poster-close{
  position:absolute; top:6px; right:8px;
  border:0; background:transparent; font-size:18px; line-height:1;
  cursor:pointer; color:#444;
}