:root{
	--bg: #0b1220;
	--panel: #0f1b32;
	--muted: rgba(255,255,255,.7);
	--text: #fff;
	--border: rgba(255,255,255,.12);
	--accent: #3b82f6;
	--danger: #ef4444;
	--ok: #22c55e;
	--radius: 14px;
	--shadow: 0 10px 30px rgba(0,0,0,.35);
	--font: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
*{ box-sizing: border-box; }
body{
	margin:0;
	font-family: var(--font);
	background: radial-gradient(900px 600px at 15% -10%, rgba(59,130,246,.25), transparent 55%), var(--bg);
	color: var(--text);
}
.wrap{ width: min(1200px, 100% - 2rem); margin: 2rem auto 4rem; }
.top{ display:flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.top h1{ margin:0; font-size: clamp(1.5rem, 3vw, 2rem); }
.top-actions{ display:flex; gap: .6rem; align-items: center; justify-content: flex-end; flex-wrap: wrap; }
.grid{ display:grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 1000px){ .grid{ grid-template-columns: 1.05fr .95fr; } }
.card{
	background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
	border: 1px solid var(--border);
	border-radius: var(--radius);
	box-shadow: var(--shadow);
	padding: 1rem;
}
.row{ display:flex; align-items:center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; }
hr{ border:0; border-top:1px solid var(--border); margin: 1rem 0; }
.muted{ color: var(--muted); margin: .25rem 0 0; }

.form{ display:flex; flex-direction: column; gap: .85rem; margin-top: .75rem; }
label{ display:flex; flex-direction: column; gap: .4rem; }
label span{ font-weight: 650; }
input[type="text"], input[type="password"], textarea{
	width: 100%;
	border-radius: 12px;
	border: 1px solid var(--border);
	background: rgba(0,0,0,.22);
	color: var(--text);
	padding: .75rem .85rem;
	font: inherit;
}
textarea{ resize: vertical; }
.checkbox{ flex-direction: row; align-items:center; gap: .6rem; }
.checkbox span{ font-weight: 650; }

.btn{
	border: 1px solid var(--border);
	background: rgba(255,255,255,.06);
	color: var(--text);
	padding: .75rem 1rem;
	border-radius: 999px;
	cursor: pointer;
	font: inherit;
	font-weight: 700;
}
.btn:hover{ filter: brightness(1.08); }
.btn.primary{ background: var(--accent); border-color: rgba(0,0,0,.0); }
.btn.danger{ background: rgba(239,68,68,.18); border-color: rgba(239,68,68,.45); }

.list{ display:flex; flex-direction: column; gap: .6rem; margin-top: .75rem; }
.item{
	display:grid;
	grid-template-columns: 64px 1fr auto;
	gap: .75rem;
	align-items: center;
	padding: .7rem;
	border-radius: 14px;
	border: 1px solid var(--border);
	background: rgba(0,0,0,.16);
	cursor: pointer;
}
.item:hover{ background: rgba(0,0,0,.24); }
.thumb{ width:64px; height:48px; object-fit: cover; border-radius: 10px; background: rgba(255,255,255,.06); border: 1px solid var(--border); }
.item-title{ font-weight: 800; }
.badge{ font-size: .85rem; padding: .2rem .55rem; border-radius: 999px; border: 1px solid var(--border); color: var(--muted); }
.badge.sold{ border-color: rgba(239,68,68,.45); color: #fecaca; background: rgba(239,68,68,.14); }

.status{ padding: .6rem .75rem; border-radius: 12px; border: 1px solid var(--border); background: rgba(0,0,0,.18); }
.status.ok{ border-color: rgba(34,197,94,.45); color: #bbf7d0; background: rgba(34,197,94,.10); }
.status.err{ border-color: rgba(239,68,68,.55); color: #fecaca; background: rgba(239,68,68,.10); }
.error{ margin-top: .75rem; padding: .6rem .75rem; border-radius: 12px; border: 1px solid rgba(239,68,68,.55); color: #fecaca; background: rgba(239,68,68,.10); }

.images{ display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; margin-top: .75rem; }
@media (min-width: 520px){ .images{ grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.imgcard{ border: 1px solid var(--border); border-radius: 14px; overflow: hidden; background: rgba(0,0,0,.16); }
.imgcard img{ display:block; width:100%; height:120px; object-fit: cover; }
.imgcard .imgrow{ display:flex; justify-content: space-between; align-items:center; gap: .5rem; padding: .5rem; }
.imgcard .imgname{ font-size: .85rem; color: var(--muted); overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
.imgcard button{ padding: .45rem .6rem; border-radius: 10px; }