* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: -apple-system, 'Segoe UI', system-ui, sans-serif; background: #f4f6f8; color: #1e293b; }
a { text-decoration: none; color: inherit; }
.admin-login { max-width: 380px; margin: 100px auto; background: #fff; padding: 40px; border-radius: 14px; box-shadow: 0 8px 30px rgba(0,0,0,.08); }
.admin-login h2 { text-align: center; margin-bottom: 24px; }
.admin-login input { width: 100%; padding: 12px; margin-bottom: 12px; border: 1.5px solid #e2e8f0; border-radius: 8px; font-size: 15px; }
.admin-login button { width: 100%; padding: 12px; background: #e91e63; color: #fff; border: none; border-radius: 8px; font-weight: 600; cursor: pointer; }
.err { background: #fee2e2; color: #991b1b; padding: 10px; border-radius: 6px; margin-bottom: 14px; }
.admin-layout { display: grid; grid-template-columns: 240px 1fr; min-height: 100vh; }
.sidebar { background: #0f172a; color: #cbd5e1; padding: 24px 0; }
.sidebar .brand { font-size: 18px; font-weight: 700; color: #fff; padding: 0 24px 20px; border-bottom: 1px solid #1e293b; margin-bottom: 16px; }
.sidebar nav { display: flex; flex-direction: column; gap: 2px; padding: 0 12px; }
.sidebar nav a { padding: 11px 14px; border-radius: 8px; color: #cbd5e1; font-size: 14px; transition: .15s; }
.sidebar nav a:hover { background: #1e293b; color: #fff; }
.admin-main { padding: 32px 40px; }
.admin-main h1 { font-size: 24px; margin-bottom: 24px; }
.admin-form { background: #fff; padding: 28px; border-radius: 14px; box-shadow: 0 2px 8px rgba(0,0,0,.04); max-width: 800px; }
.admin-form h3 { font-size: 15px; color: #0f172a; margin: 20px 0 16px; padding-bottom: 8px; border-bottom: 1px solid #f1f5f9; }
.admin-form label { display: block; margin-bottom: 16px; font-size: 14px; font-weight: 500; color: #334155; }
.admin-form input[type=text], .admin-form input[type=email], .admin-form input[type=password],
.admin-form input[type=number], .admin-form textarea, .admin-form select {
    width: 100%; padding: 11px 14px; margin-top: 6px;
    border: 1.5px solid #e2e8f0; border-radius: 8px;
    font-family: inherit; font-size: 14px;
}
.admin-form input[type=color] { width: 60px; height: 40px; border: none; cursor: pointer; margin-top: 6px; }
.admin-form textarea { resize: vertical; min-height: 90px; }
.admin-form input[type=checkbox] { margin-right: 8px; }
.admin-form small { color: #64748b; font-size: 12px; display: block; margin-top: 4px; }
.btn-save { padding: 13px 28px; background: #e91e63; color: #fff; border: none; border-radius: 8px; font-weight: 600; font-size: 15px; cursor: pointer; margin-top: 20px; }
.btn-save:hover { background: #c2185b; }
.preview { max-width: 180px; margin-top: 8px; border-radius: 8px; border: 1px solid #e2e8f0; }
.admin-table { width: 100%; background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,.04); border-collapse: collapse; }
.admin-table th, .admin-table td { padding: 12px 16px; text-align: left; font-size: 14px; border-bottom: 1px solid #f1f5f9; }
.admin-table th { background: #f8fafc; font-weight: 600; color: #475569; font-size: 12px; text-transform: uppercase; }
.admin-table tr:hover td { background: #f8fafc; }
.thumb { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
.btn-primary { display: inline-block; background: #e91e63; color: #fff !important; padding: 9px 20px; border-radius: 8px; font-size: 14px; font-weight: 600; margin-bottom: 20px; }