/* 🇮🇸: Minimal, hreint útlit. Þú getur fegrað eins og þú vilt. */
:root { --bg:#0b0c10; --card:#111318; --muted:#98a2b3; --text:#e6e6e6; --brand:#7c5cff; --brand-2:#00e5ff; }
* { box-sizing: border-box; }
html,body { margin:0; padding:0; font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; background: var(--bg); color: var(--text); }
.container { max-width: 1100px; margin: 0 auto; padding: 0 16px; }
.hidden { display: none !important; }
.muted { color: var(--muted); }

.site-header { position: sticky; top:0; backdrop-filter: blur(8px); background: rgba(11,12,16,0.6); border-bottom: 1px solid #1f2430; z-index:10; }
.header-inner { display:flex; align-items:center; justify-content:space-between; height:64px; }
.brand { font-weight:800; letter-spacing:-0.02em; font-size: 22px; }
.brand span { color: var(--brand-2); }
.nav { display:flex; align-items:center; gap:12px; }
.user-badge { padding:6px 10px; background: #1b1f2a; border:1px solid #232838; border-radius: 999px; font-size: 12px; }

.btn { border:1px solid #2a3143; background:#151822; padding:8px 14px; border-radius: 10px; color:#fff; cursor:pointer; }
.btn.primary { background: linear-gradient(135deg, var(--brand) 0%, var(--brand-2) 100%); border: none; }
.btn.ghost { background: transparent; }
.btn.lg { padding: 12px 18px; font-size: 16px; }
.btn.link { border:none; background:transparent; text-decoration:underline; color:#cbd5ff; }

.hero { position:relative; padding: 96px 0 56px; overflow:hidden; }
.hero .container { position:relative; z-index:2; }
.hero h1 { font-size: clamp(32px, 6vw, 56px); line-height:1.05; margin:0 0 12px; }
.hero p { color: var(--muted); margin:0 0 24px; }
.hero-bg { position:absolute; inset:-20% -10% auto -10%; height: 70%; background: radial-gradient(800px 400px at 20% 20%, rgba(124,92,255,0.18), transparent), radial-gradient(800px 400px at 80% 10%, rgba(0,229,255,0.12), transparent); filter: blur(30px); z-index:1; }
.hero-cta { display:flex; gap:12px; }

.card { border-top: 1px solid #1f2430; background: #0d0f14; padding: 24px 0; }
.create-listing .grid { display:grid; grid-template-columns: 1fr 1fr; gap:16px; }
.create-listing label { display:flex; flex-direction:column; gap:6px; }
.create-listing label.full { grid-column: 1/-1; }
.create-listing input, .create-listing textarea, .filters input, .filters select { width:100%; padding:10px 12px; border-radius:10px; background:#0c0f15; border:1px solid #232838; color:#fff; }
.create-listing .file input { padding: 12px; }
.form-actions { margin-top:12px; display:flex; align-items:center; gap:12px; }

.market { padding: 28px 0 60px; }
.section-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom: 16px; }
.filters { display:flex; align-items:center; gap: 10px; }
.grid-cards { display:grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 16px; }
.card-item { background: #0d0f14; border:1px solid #1f2430; border-radius: 16px; overflow:hidden; display:flex; flex-direction:column; }
.card-item img { width:100%; height: 170px; object-fit: cover; display:block; }
.card-item .meta { padding: 12px; display:flex; flex-direction:column; gap:6px; }
.card-item .title { font-weight: 600; }
.card-item .price { font-weight: 700; }
.card-item .desc { color: var(--muted); font-size: 14px; }

.site-footer { border-top: 1px solid #1f2430; padding: 20px 0; color: var(--muted); }
.user-badge {
  padding: 6px 12px;
  border-radius: 6px;
  color: #fff;
  background: rgba(255, 255, 255, 0.08);
  transition: all 0.2s ease;
  font-weight: 500;
  cursor: pointer;
}

.user-badge:hover {
  background: var(--accent, #00baff);
  color: #fff;
}
.account-inputs {
  display: flex;
  gap: 4px;
  align-items: center;
}
.account-inputs input {
  width: 70px;
  text-align: center;
}