/* Import a retro-looking font */
@import url('https://fonts.googleapis.com/css2?family=Courier+Prime&display=swap');

body {
    background: url('your-background-tile.png') repeat; /* Use a pastel/patterned image */
    font-family: 'Courier Prime', monospace;
    color: #333;
    padding: 20px;
}

.container {
    max-width: 900px;
    margin: 0 auto;
}

.main-content {
    display: flex;
    flex-wrap: wrap; /* Makes it stack on mobile */
    gap: 20px;
}

.box {
    background: #fff;
    border: 3px solid #ffb6c1; /* Pink border */
    padding: 15px;
    margin-bottom: 15px;
    box-shadow: 5px 5px 0px #aaa; /* Retro shadow effect */
}

/* Sidebar and Main Body layout */
.sidebar { flex: 1; min-width: 200px; }
.main-body { flex: 2; min-width: 300px; }

/* Responsive adjustments */
@media (max-width: 600px) {
    .main-content { flex-direction: column; }
}
