* { box-sizing: border-box; }
body { background: #121216; color: #eee; font-family: sans-serif; margin: 0; padding: 0; }
a { color: #4df; text-decoration: none; }
header, footer { background: #1a1a1f; padding: 1rem; text-align: center; }
nav a { margin: 0 1rem; color: #fff; }
.btn { padding: 10px 20px; background: #4df; color: #000; border: none; border-radius: 5px; cursor: pointer; }
.form-box { background: #1e1e2e; padding: 20px; border-radius: 10px; margin: 20px auto; width: 90%; max-width: 400px; }
.container { width: 90%; max-width: 900px; margin: auto; }
.media-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 15px; }
.media-card { background: #1e1e1e; border-radius: 8px; padding: 10px; display: flex; flex-direction: column; align-items: center; }
.thumb { width: 100%; position: relative; padding-top: 56.25%; overflow: hidden; border-radius: 5px; margin-bottom: 8px; }
.thumb img, .thumb video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.media-card h4 { margin: 0; font-size: 14px; color: #fff; text-align: center; word-break: break-word; }