* { box-sizing: border-box; }
body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background: #111; color: #eee; margin: 0; padding: 1rem;
}
main { max-width: 1200px; margin: 0 auto; }
a { color: #6cf; }
.flash { padding: .5rem 1rem; margin-bottom: 1rem; border-radius: 4px; }
.flash-error { background: #722; }
.flash-success { background: #141; }
.login-form {
    max-width: 320px; margin: 4rem auto; display: flex; flex-direction: column; gap: .75rem;
}
.login-form label { display: flex; flex-direction: column; gap: .25rem; }
.login-form input, .login-form button {
    padding: .5rem; border: 1px solid #333; background: #222; color: #eee; border-radius: 4px;
}
.login-form button { background: #36a; cursor: pointer; }

.topbar {
    display: flex; gap: 1rem; align-items: center; flex-wrap: wrap;
    padding-bottom: 1rem; border-bottom: 1px solid #333; margin-bottom: 1rem;
}
.topbar h1 { margin: 0; flex: 1; font-size: 1.25rem; }
.upload-form { display: flex; gap: .5rem; }
.upload-form input[type=file] { color: #ccc; }
button {
    padding: .4rem .8rem; background: #36a; color: #fff;
    border: 0; border-radius: 4px; cursor: pointer;
}
.player-wrap { margin-bottom: 1.5rem; }
#player { width: 100%; max-height: 70vh; background: #000; border-radius: 6px; }
.now-playing { color: #aaa; font-size: .9rem; margin: .5rem 0 0; }
.video-list {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: .75rem; list-style: none; padding: 0;
}
.video-item {
    background: #1a1a1a; border-radius: 6px; overflow: hidden; cursor: pointer;
    border: 2px solid transparent; transition: border-color .15s;
}
.video-item:hover { border-color: #36a; }
.video-item.active { border-color: #6cf; }
.video-item img, .thumb-placeholder {
    width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; background: #333;
}
.video-item .title {
    display: block; padding: .5rem; font-size: .85rem; color: #ddd;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
