html{
cursor:crosshair;
}

body{
margin:0;
background:#151a14;
font-family:"Cormorant Garamond",serif;
color:#efe7d9;
}

.wallpaper{
position:fixed;
inset:0;
background:
radial-gradient(circle at 20% 20%,rgba(255,255,255,.03),transparent 25%),
repeating-linear-gradient(45deg,#151a14,#151a14 18px,#1a2119 18px,#1a2119 36px);
z-index:-2;
}

.window{
width:min(1100px,92%);
margin:40px auto;
background:#11140fdd;
border:4px ridge #5b6148;
box-shadow:0 0 0 1px #222,0 20px 60px rgba(0,0,0,.6);
}

.topbar{
display:flex;
justify-content:space-between;
padding:8px 12px;
background:#2d3528;
font-size:14px;
border-bottom:2px solid #515843;
}

header{text-align:center;padding:30px;}

h1{
font-family:"IM Fell English",serif;
font-size:82px;
letter-spacing:10px;
margin:0;
}

.script{
font-family:"Allura",cursive;
font-size:56px;
margin:-15px 0 20px;
color:#d8c6a9;
}

marquee{
background:#242b21;
padding:10px;
border:1px solid #4d5640;
}

.layout{
display:grid;
grid-template-columns:260px 1fr;
}

aside{
padding:24px;
border-right:1px dashed #535b48;
}

aside ul{
list-style:none;
padding:0;
line-height:2;
}

.counter{
margin-top:30px;
padding:10px;
background:#283022;
font-family:monospace;
}

main{padding:30px;}

.paper{
background:#d9ccb4;
color:#352d21;
padding:25px;
transform:rotate(-1deg);
max-width:520px;
box-shadow:8px 8px 0 rgba(0,0,0,.3);
}

.polaroids{
display:flex;
gap:25px;
margin-top:40px;
flex-wrap:wrap;
}

.photo{
width:180px;
height:220px;
background:#efe7d9;
color:#444;
display:flex;
align-items:center;
justify-content:center;
transform:rotate(-3deg);
border:12px solid white;
transition:.3s;
}

.photo:nth-child(2){transform:rotate(2deg);}
.photo:nth-child(3){transform:rotate(-6deg);}

.photo:hover{
transform:scale(1.05) rotate(0deg);
}

footer{
padding:20px;
text-align:center;
border-top:1px dashed #50564a;
color:#bfb39e;
}

@media(max-width:800px){
.layout{grid-template-columns:1fr;}
aside{border-right:none;border-bottom:1px dashed #535b48;}
h1{font-size:56px;}
.script{font-size:42px;}
}