body {
    background-color: #f0f0f0; /* Light grey background for the page */
    margin: 0;
    display: flex;
    justify-content: center; /* Centers the room in the middle of the screen */
    padding-top: 50px;
}

/* THE DIORAMA BOX */
.room-container {
    position: relative; /* CRITICAL: This makes the box the "anchor" */
    width: 1000px;      /* Fixed width so your layout doesn't break */
    height: 800px;      /* Fixed height matching your background image */
}

/* THE WALLPAPER */
.room-background {
    width: 100%;
    height: 100%;
    object-fit: contain; /* Ensures the image fits nicely */
    z-index: 1;          /* Layer 1: The very back */
}

/* THE ART ITEMS (Generic Rules) */
.art-item {
    position: absolute; /* allows you to move it freely */
    z-index: 10;        /* Layer 10: Sits on top of the background */
    transition: transform 0.2s; /* Smooth animation when hovered */
}

/* THE INTERACTION */
.art-item:hover {
    transform: scale(1.1) rotate(5deg); /* Grow and tilt when mouse touches it */
    cursor: pointer;
}

/* POSITIONING ITEM #1 */
#item-1 {brackets_emilythinking
}
    width: 150px; /* Resize your art here */
    top: 200;     /* Start at the top */
    left: 0px;    /* Start at the left */
}