* { box-sizing: border-box; }
html, body { 
  margin: 0; 
  padding: 0; 
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; 
  background: transparent; 
  color: #e6e6e6; 
}
a { color: inherit; text-decoration: none; }
.container { max-width: 1040px; margin: 0 auto; padding: 16px; }
.brand { font-size: 22px; font-weight: 700; margin: 0; color: #007bff; }
.admin-nav { display: flex; gap: 8px; margin-bottom: 12px; }

.navbar { position: sticky; top: 0; z-index: 50; display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; background: #131517; border-bottom: 1px solid #1f2225; }
.nav-left { display: flex; align-items: center; gap: 12px; }
.nav-right { display: flex; align-items: center; gap: 16px; }
.nav-link { color: #ffffff; opacity: 0.9; padding: 8px 10px; border-radius: 8px; }
.nav-link:hover { opacity: 1; background: #1a1d20; }

.btn { appearance: none; border: 1px solid #343a3f; background: #262a2e; color: #ffffff; padding: 10px 14px; border-radius: 10px; font-weight: 600; cursor: pointer; text-decoration: none; display: inline-block; }
.btn:hover { filter: brightness(1.1); }
.btn.primary { background: #007bff; border-color: #007bff; color: #fff; }
.btn.danger { background: #d93025; border-color: #d93025; color: #fff; }

.notice { padding: 10px 12px; border-radius: 10px; margin: 8px 0; }
.notice.success { background: rgba(0,123,255,0.12); color: #007bff; }
.notice.error { background: rgba(217,48,37,0.12); color: #ff4b4b; }

.grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 700px) { .grid { grid-template-columns: 1fr 1fr; } }

.card { 
  background: rgba(23, 25, 28, 0.9); 
  border: 1px solid rgba(38, 42, 46, 0.8); 
  border-radius: 12px; 
  overflow: hidden; 
  box-shadow: none;
  backdrop-filter: blur(10px);
}
.card .title { font-size: 16px; font-weight: 600; padding: 12px; color: #ffffff; }
.card .meta { font-size: 12px; color: #9aa0a6; padding: 0 12px 12px; }
.thumb { width: 100%; height: auto; display: block; aspect-ratio: 16 / 9; object-fit: cover; background: #0d0f12; }

.form { display: grid; gap: 10px; padding: 12px; }
.form.inline { grid-template-columns: 1fr 1fr; }
.input { width: 100%; padding: 10px 12px; border: 1px solid #2a2f33; border-radius: 10px; background: #111315; color: #e6e6e6; }
.label { font-size: 14px; color: #9aa0a6; }
.error { color: #ff4b4b; margin-top: 8px; }

summary { list-style: none; cursor: pointer; }
summary::-webkit-details-marker { display: none; }
.link-item { text-decoration: none; color: inherit; display: block; border-top: 1px solid #262a2e; }