*{
box-sizing:border-box;
margin:0;
padding:0;
}

body{
font-family:"Times New Roman";
background:#fff5f8;
height:100vh;
overflow:hidden;
}

/* HEADER */

.header{
background:linear-gradient(to right,#ff69b4,#f8bbd0);
padding:15px;
text-align:center;
color:#880e4f;
font-size:24px;
border-bottom:3px solid #f06292;
}

/* NAVBAR */

.navbar{
background:linear-gradient(to right,#ff99cc,#ff66b2);
padding:10px;
display:flex;
justify-content:center;
gap:30px;
}

.navbar a{
color:white;
text-decoration:none;
font-weight:bold;
}

/* LAYOUT */

.container{
display:flex;
height:calc(100vh - 130px);
}

/* SIDEBAR */

.sidebar{
width:230px;
background:#ffb6c1;
padding:15px;
overflow-y:auto;
}

.sidebar h3{
text-align:center;
margin-bottom:15px;
color:#880e4f;
}

.sidebar button{
width:100%;
padding:10px;
margin-bottom:5px;
border:none;
background:#ff69b4;
color:white;
font-weight:bold;
border-radius:8px;
cursor:pointer;
}

.sidebar button:hover{
background:#f06292;
}

.menu-content{
background:#ffc1e3;
border-radius:8px;
margin-bottom:8px;
}

/* MAIN */

.main-content{
flex:1;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
}

.glass-card{
width:480px;
height:350px;
background:linear-gradient(135deg,#ffb6c1,#ffc1e3,#ff69b4);
border:4px solid #f06292;
border-radius:15px;
padding:20px;
text-align:center;
display:flex;
flex-direction:column;
justify-content:center;
}

.divider-line{
border-top:2px solid #880e4f;
margin-bottom:10px;
}

.footer-name{
margin-top:10px;
font-weight:bold;
color:#880e4f;
}

.dark-mode{
filter:invert(1) hue-rotate(180deg);
}