* { box-sizing: border-box; }
body {
    margin: 0;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background: #f3f4f6;
    color: #111827;
}
.topbar {
    background: #111827;
    color: white;
    padding: 14px 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.container { max-width: 1200px; margin: 30px auto; padding: 0 16px; }
.card {
    background: white;
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 20px;
    box-shadow: 0 4px 18px rgba(0,0,0,.06);
}
.centered { min-height: 100vh; display: grid; place-items: center; }
.login-card { width: min(420px, calc(100% - 32px)); }
h1, h2 { margin-top: 0; }
label { display:block; font-weight:600; margin-bottom:14px; }
input[type=text], input[type=password], input[type=url] {
    display:block; width:100%; margin-top:7px; padding:12px;
    border:1px solid #d1d5db; border-radius:8px; font-size:16px;
}
button {
    border:0; border-radius:8px; padding:10px 16px; cursor:pointer;
    background:#2563eb; color:white; font-weight:600;
}
button:hover { opacity:.9; }
button.secondary { background:#4b5563; }
button.small { padding:7px 10px; font-size:13px; }
.inline { display:inline; }
.url-form { display:grid; grid-template-columns:1fr auto; gap:10px; }
.alert { padding:12px; border-radius:8px; margin-bottom:15px; }
.error { background:#fee2e2; color:#991b1b; }
.muted { color:#6b7280; }
.video-header { display:flex; gap:20px; align-items:flex-start; }
.thumb { width:260px; max-width:40%; border-radius:8px; }
.table-wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; }
th, td { padding:10px 8px; border-bottom:1px solid #e5e7eb; text-align:left; vertical-align:middle; }
th { background:#f9fafb; }
@media (max-width:700px) {
    .url-form { grid-template-columns:1fr; }
    .video-header { flex-direction:column; }
    .thumb { max-width:100%; width:100%; }
}

.top-link { color: white; text-decoration: none; margin-right: 12px; }
.success { background:#dcfce7; color:#166534; }
.danger { background:#dc2626; }
.admin-form { max-width: 600px; }
.checkbox { display:flex; gap:8px; align-items:center; font-weight:500; }
.checkbox input { width:auto; }
.action-stack { display:flex; flex-wrap:wrap; gap:7px; align-items:center; }
.action-stack form { display:flex; gap:5px; align-items:center; }
.action-stack input[type=password] { width:160px; margin:0; padding:7px; font-size:13px; }
