:root {
  --primary: #1A2E5C;
  --primary-sub: rgba(26,46,92,0.06);
  --primary-light: #2A4A7F;
  --green: #0F9D6E;
  --orange: #D4952B;
  --red: #DC3E4A;
  --text: #1A1A1E;
  --text2: #7A7A82;
  --text3: #A8A8B0;
  --bg: #F6F5F2;
  --card: #FFFFFF;
  --border: #E5E1DA;
  --border-light: #F0EDE8;
  --shadow: 0 8px 32px rgba(0,0,0,0.06);
  --shadow-hover: 0 16px 48px rgba(0,0,0,0.08);
  --r: 10px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Inter', sans-serif; background: var(--bg); color: var(--text); -webkit-font-smoothing: antialiased; }

/* bar */
.bar { position: sticky; top: 0; z-index: 100; background: rgba(255,255,255,0.92); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid #e2e8f0; }
.bar-inner { max-width: 1200px; margin: 0 auto; padding: 0 32px; height: 56px; display: flex; align-items: center; gap: 24px; }
.brand { display:flex; flex-direction:column; align-items:center; gap:2px }
.bar-divider { display:flex; align-items:center; justify-content:center }
.bar-divider span { display:block; width:40px; height:16px; border:1.5px solid var(--primary); border-color:var(--primary) transparent transparent transparent; border-radius:50% 50% 0 0/100% 100% 0 0 }
.brand .bar-divider:last-of-type span { border-color:transparent transparent var(--primary) transparent; border-radius:0 0 50% 50%/0 0 100% 100% }
.brand-name { font-size: 1rem; font-weight: 600; color: #0f172a; letter-spacing: -0.2px }
.search-wrap { position: relative; flex: 1; max-width: 280px; }
.search-wrap i { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); font-size: 0.78rem; color: #94a3b8; pointer-events: none; }
.search-wrap input { width: 100%; height: 34px; padding: 0 11px 0 33px; font-size: 0.82rem; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; color: #0f172a; transition: all 0.15s; }
.search-wrap input:focus { border-color: #1e3a5f; background: #fff; outline: none }
.search-wrap input::placeholder { color: #94a3b8; }
.acct-btn { display: flex; align-items: center; gap: 8px; padding: 4px 12px; border-radius: 6px; border: none; background: transparent; cursor: pointer; transition: all 0.15s; margin-left: auto; flex-shrink: 0; }
.acct-btn:hover { background: #f1f5f9; }
.acct-name { font-size: 0.82rem; font-weight: 500; color: #475569; line-height: 1.2; letter-spacing: -0.05px; }
.acct-role { font-size: 0.72rem; font-weight: 400; color: #94a3b8; margin-left: 4px }
.admin-link { font-size: 0.82rem; font-weight: 500; color: var(--primary); text-decoration: none; margin-left: auto; padding: 6px 14px; border: 1px solid #e2e8f0; border-radius: 6px; transition: all 0.15s }
.admin-link:hover { background: #f1f5f9; border-color: var(--primary) }

/* content */
.content { max-width: 1000px; margin: 0 auto; padding: 32px 20px 56px; }
.card { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-md); overflow: hidden; box-shadow: var(--shadow); }

.dim { font-size: 0.75rem; color: var(--text3); font-weight: 500; }

/* filters */
.filters { display: flex; gap: 8px; padding: 14px 20px; border-bottom: 1px solid var(--border-light); }
.img-upload { border: 1.5px dashed var(--border); border-radius: var(--radius-sm); padding: 16px; text-align: center; cursor: pointer; transition: 0.2s; background: var(--bg); }
.img-upload:hover { border-color: var(--primary); background: var(--primary-sub); }
.plus { font-size: 2rem; font-weight: 300; color: var(--text3); line-height: 1; }
.img-preview { position: relative; display: inline-block; margin-top: 8px; }
.img-preview img { width: 64px; height: 64px; border-radius: 6px; object-fit: cover; border: 1px solid var(--border); }
.img-preview button { position: absolute; top: -6px; right: -6px; width: 18px; height: 18px; border-radius: 50%; border: none; background: var(--red); color: #fff; font-size: 0.6rem; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.modal-img-col .img-upload { width: 120px; height: 120px; margin: 0; padding: 0; position: relative; border-radius: var(--radius-sm); }
.modal-img-col .img-upload .plus { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 2.5rem; }
.modal-img-col .img-preview { width: 120px; height: 120px; margin: 0; position: relative; display: none; }
.modal-img-col .img-preview img { width: 120px; height: 120px; border-radius: var(--radius-sm); object-fit: cover; }
.modal-img-col .img-preview button { top: -8px; right: -8px; width: 22px; height: 22px; font-size: 0.65rem; }
.filters select { padding: 8px 14px; border: 1px solid var(--border); border-radius: var(--radius-sm); font-size: 0.8rem; font-weight: 500; color: var(--text); background: var(--bg); cursor: pointer; outline: none; transition: 0.2s; min-width: 160px; }
.filters select:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(26,46,92,0.08); }
.add-btn { margin-left: auto; padding: 8px 18px; font-size: 0.78rem; white-space: nowrap; }

/* table */
.scroll { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 0.84rem; }
thead th { text-align: left; padding: 11px 18px; font-weight: 600; font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.6px; color: var(--text); border-bottom: 1px solid var(--border); white-space: nowrap; background: #F8F6F2; }
tbody tr { transition: 0.12s; border-bottom: 1px solid var(--border-light); }
tbody tr:last-child { border: none; }
tbody tr:hover { background: rgba(26,46,92,0.02); }
tbody td { padding: 11px 18px; vertical-align: middle; }
.prod-img { width: 40px; height: 40px; border-radius: 6px; object-fit: cover; background: var(--bg); border: 1px solid var(--border-light); }
.badge { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; border-radius: 20px; font-size: 0.7rem; font-weight: 600; }
.badge.green { background: rgba(15,157,110,0.08); color: var(--green); }
.badge.orange { background: rgba(212,149,43,0.08); color: var(--orange); }
.badge.red { background: rgba(220,62,74,0.08); color: var(--red); }
.act-btn { width: 30px; height: 30px; border-radius: 7px; border: none; background: none; cursor: pointer; font-size: 0.78rem; color: var(--text3); transition: all 0.15s; display: inline-flex; align-items: center; justify-content: center; }
.act-btn:hover { background: var(--primary-sub); color: var(--primary); }
.act-btn.del:hover { background: rgba(220,62,74,0.06); color: var(--red); }

/* modal */
.overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.35); z-index: 300; opacity: 0; visibility: hidden; transition: 0.25s; backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
.overlay.open { opacity: 1; visibility: visible; }
.modal { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%) scale(0.92); background: var(--card); border-radius: var(--radius-lg); box-shadow: 0 20px 60px rgba(0,0,0,0.12); z-index: 301; width: 440px; max-width: calc(100vw - 32px); opacity: 0; visibility: hidden; transition: all 0.3s cubic-bezier(0.16,1,0.3,1); }
.modal.open { opacity: 1; visibility: visible; transform: translate(-50%,-50%) scale(1); }
.modal-hd { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px; border-bottom: 1px solid var(--border-light); }
.modal-hd h3 { font-size: 0.95rem; font-weight: 600; color: var(--text); }
.modal-hd button { width: 30px; height: 30px; border-radius: 50%; border: none; background: none; cursor: pointer; color: var(--text2); font-size: 0.9rem; display: flex; align-items: center; justify-content: center; transition: 0.15s; }
.modal-hd button:hover { background: var(--bg); }
.modal-body { padding: 22px; }
.modal-layout { display: flex; gap: 22px; align-items: flex-start; }
.modal-img-col { width: 120px; flex-shrink: 0; }
.modal-img-col .img-preview img { width: 120px; height: 120px; border-radius: var(--radius-sm); object-fit: cover; }
.modal-img-col .img-preview button { top: -8px; right: -8px; width: 22px; height: 22px; font-size: 0.65rem; }
.modal-fields-col { flex: 1; min-width: 0; }
.field { margin-bottom: 14px; }
.field:last-child { margin-bottom: 0; }
.field label { display: block; font-size: 0.75rem; font-weight: 600; margin-bottom: 5px; color: var(--text); letter-spacing: 0.1px; }
.field input, .field select { width: 100%; padding: 9px 12px; border: 1px solid var(--border); border-radius: var(--radius-sm); font-size: 0.84rem; color: var(--text); background: var(--bg); transition: 0.2s; }
.field input:focus, .field select:focus { border-color: var(--primary); background: var(--card); box-shadow: 0 0 0 3px rgba(26,46,92,0.08); }
.row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

@media (max-width: 480px) { .modal-layout { flex-direction: column; align-items: center; } .modal-img-col { width: 100px; } .modal-img-col .img-upload, .modal-img-col .img-preview, .modal-img-col .img-preview img { width: 100px; height: 100px; } }
.modal-ft { display: flex; gap: 8px; justify-content: flex-end; padding: 16px 22px; border-top: 1px solid var(--border-light); }
.btn { padding: 9px 20px; border-radius: var(--radius-sm); font-size: 0.8rem; font-weight: 600; cursor: pointer; border: none; transition: all 0.2s; display: inline-flex; align-items: center; gap: 6px; }
.btn.pri { background: var(--primary); color: #fff; }
.btn.pri:hover { background: var(--primary-light); box-shadow: 0 4px 12px rgba(26,46,92,0.2); }
.btn.sec { background: var(--bg); color: var(--text2); border: 1px solid var(--border); }
.btn.sec:hover { background: var(--border); color: var(--text); }

/* analytics cards */
.stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 20px }
.stat { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 18px 20px; box-shadow: var(--shadow) }
.stat-label { font-size: 0.7rem; font-weight: 600; color: var(--text3); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 4px }
.stat-val { font-size: 1.4rem; font-weight: 800; color: var(--primary); letter-spacing: -0.4px }
.stat-sub { font-size: 0.72rem; color: var(--text2); margin-top: 2px }

/* sales drawer */
.drawer-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 500; opacity: 0; visibility: hidden; transition: all 0.3s; backdrop-filter: blur(3px) }
.drawer-overlay.open { opacity: 1; visibility: visible }
.drawer { position: fixed; top: 0; right: 0; width: 480px; max-width: 100vw; height: 100vh; background: var(--card); z-index: 501; box-shadow: -8px 0 40px rgba(0,0,0,0.08); transform: translateX(100%); transition: transform 0.35s cubic-bezier(0.16,1,0.3,1); display: flex; flex-direction: column }
.drawer.open { transform: translateX(0) }
.drawer-hd { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px; border-bottom: 1px solid var(--border-light); flex-shrink: 0 }
.drawer-hd h3 { font-size: 1rem; font-weight: 700; display: flex; align-items: center; gap: 8px }
.drawer-hd h3 i { color: var(--primary) }
.drawer-close { width: 30px; height: 30px; border-radius: 50%; border: none; background: none; cursor: pointer; color: var(--text2); font-size: 0.9rem; display: flex; align-items: center; justify-content: center; transition: 0.15s }
.drawer-close:hover { background: var(--bg) }
.drawer-body { flex: 1; overflow-y: auto; padding: 16px 22px }
.drawer-ft { border-top: 1px solid var(--border-light); padding: 16px 22px; flex-shrink: 0; background: var(--card) }
.drawer-ft .grand-total { font-size: 1.1rem; font-weight: 700; color: var(--primary); margin-bottom: 12px; text-align: right }
.drawer-ft .drawer-actions { display: flex; gap: 8px }
.drawer-ft .drawer-actions .btn { flex: 1; justify-content: center }

.sale-row { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--border-light); min-height: 48px }
.sale-row:last-child { border-bottom: none }
.sale-row-info { flex: 1; min-width: 0 }
.sale-row-name { font-size: 0.84rem; font-weight: 600; color: var(--text) }
.sale-row-price { font-size: 0.76rem; color: var(--text2); font-weight: 500 }
.sale-row-qty { width: 60px; padding: 7px 8px; border: 1px solid var(--border); border-radius: var(--radius-sm); font-size: 0.85rem; text-align: center; font-weight: 600; color: var(--text); background: var(--bg); transition: 0.2s; outline: none }
.sale-row-qty:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(26,46,92,0.08); background: var(--card) }
.sale-row-total { font-size: 0.88rem; font-weight: 700; color: var(--primary); min-width: 60px; text-align: right; letter-spacing: -0.2px }
.sale-row-img { width: 32px; height: 32px; border-radius: 6px; object-fit: cover; border: 1px solid var(--border-light); flex-shrink: 0 }

@media (max-width: 520px) { .drawer { width: 100vw } .stats { grid-template-columns: 1fr } .sale-row { flex-wrap: wrap } .sale-row-total { min-width: 50px } }

/* toast */
.toast-wrap { position: fixed; bottom: 20px; right: 20px; z-index: 600; display: flex; flex-direction: column; gap: 8px; }
.toast { display: flex; align-items: center; gap: 10px; padding: 12px 18px; background: var(--card); border-radius: var(--radius-sm); box-shadow: 0 8px 32px rgba(0,0,0,0.1); font-size: 0.82rem; font-weight: 500; animation: up 0.3s ease; min-width: 220px; border: 1px solid var(--border); border-left: 3px solid var(--primary); }
.toast.s { border-left-color: var(--green); } .toast.e { border-left-color: var(--red); } .toast.w { border-left-color: var(--orange); }

/* login */
.login-body { display:flex;align-items:center;justify-content:center;min-height:100vh;background:linear-gradient(135deg,#F6F5F2 0%,#EDE7DD 100%);padding:24px }
.login-wrap { width:100%;max-width:400px }
.login-card { background:rgba(255,255,255,0.95);border:1px solid var(--border);border-radius:var(--radius-lg);padding:40px 32px;box-shadow:0 16px 48px rgba(0,0,0,0.07) }
.login-brand { display:flex;flex-direction:column;align-items:center;gap:4px;margin-bottom:32px }
.login-divider { width:100%; display:flex; align-items:center; justify-content:center }
.login-divider span { display:block; width:80px; height:24px; border:2px solid var(--primary); border-color:var(--primary) transparent transparent transparent; border-radius:50% 50% 0 0/100% 100% 0 0 }
.login-brand .login-divider:last-of-type span { border-color:transparent transparent var(--primary) transparent; border-radius:0 0 50% 50%/0 0 100% 100% }
.login-name { font-size:1rem; font-weight:600; color:var(--primary); letter-spacing:1.5px; text-transform:uppercase }
.login-tag { font-size:0.78rem;color:var(--text3);font-weight:500 }
.login-btn { width:100%;justify-content:center;padding:11px;font-size:0.88rem;margin-top:6px;border-radius:var(--radius-sm) }
.login-err { font-size:0.78rem;color:var(--red);text-align:center;margin-top:14px;min-height:1.4em }

/* user product grid */
.prod-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;padding:16px 20px }
.prod-card { background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;transition:all 0.3s cubic-bezier(0.25,0.46,0.45,0.94);display:flex;flex-direction:column;box-shadow:0 2px 8px rgba(0,0,0,0.02) }
.prod-card:hover { transform:translateY(-3px);box-shadow:0 12px 32px rgba(0,0,0,0.06);border-color:#D4CCC2 }
.prod-card-img { width:100%;height:140px;overflow:hidden;background:#FAF8F5;position:relative }
.prod-card-img img { width:100%;height:100%;object-fit:cover;transition:transform 0.4s }
.prod-card:hover .prod-card-img img { transform:scale(1.03) }
.prod-card-body { padding:14px 16px 10px;flex:1;display:flex;flex-direction:column }
.prod-card-name { font-size:0.88rem;font-weight:600;color:var(--text);margin-bottom:3px;line-height:1.3;letter-spacing:-0.1px }
.prod-card-meta { display:flex;align-items:center;gap:10px;margin-bottom:3px }
.prod-card-price { font-size:1rem;font-weight:700;color:var(--primary);letter-spacing:-0.2px }
.prod-card-stock { font-size:0.7rem;font-weight:500 }
.prod-card-cat { font-size:0.68rem;color:var(--text3);font-weight:500;letter-spacing:0.1px }
.prod-card-btn { margin:8px 16px 14px;padding:7px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg);cursor:pointer;font-size:0.76rem;font-weight:600;color:var(--primary);transition:all 0.2s;font-family:'Inter',sans-serif }
.prod-card-btn:hover { background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:0 4px 12px rgba(26,46,92,0.2) }
.toast.s i { color: var(--green); } .toast.e i { color: var(--red); } .toast.w i { color: var(--orange); }

@keyframes up { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

/* ===== USER PAGE — MINIMAL ===== */
body.user-page { background: #fff }
.u-hero { text-align: center; padding: 40px 32px 36px; background: #f8f9fc; border-bottom: 1px solid #eef1f6; margin-bottom: 40px }
.u-hero h2 { font-size: 1.75rem; font-weight: 700; color: #0f172a; letter-spacing: -0.3px; margin-bottom: 6px }
.u-hero p { font-size: 0.95rem; color: #64748b; font-weight: 500; margin-bottom: 4px }
.u-hero .tagline { font-size: 0.92rem; color: #64748b; font-weight: 400; font-style: italic; letter-spacing: 0.1px; margin-top: 8px }
.u-content { max-width: 1200px; margin: 0 auto; padding: 0 32px 80px }

.u-controls { display: flex; gap: 12px; align-items: center; margin-bottom: 36px }
.u-controls select { padding: 8px 14px; border: 1px solid #e2e8f0; border-radius: 8px; font-size: 0.82rem; font-weight: 500; color: #334155; background: #fff; cursor: pointer; outline: none; min-width: 160px; transition: border-color 0.15s }
.u-controls select:focus { border-color: #1e3a5f }

.u-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px }
@media (max-width: 820px) { .u-grid { grid-template-columns: repeat(2, 1fr); gap: 24px } }
@media (max-width: 540px) { .u-grid { grid-template-columns: 1fr; gap: 20px } }

.u-card { background: #fff; border-radius: 16px; border: 1px solid #f1f5f9; display: flex; flex-direction: column; box-shadow: 0 1px 3px rgba(0,0,0,0.04); transition: all 0.2s ease; padding: 28px }
.u-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,0.06); transform: translateY(-3px) }

.u-card-img { width: 200px; height: 200px; aspect-ratio: 1/1; display: flex; align-items: center; justify-content: center; overflow: hidden; background: #fafafa; border-radius: 12px; padding: 24px; margin: 0 auto 20px }
.u-card-img img { width: 100%; height: 100%; object-fit: contain; object-position: center }

.u-card-body { flex: 1; display: flex; flex-direction: column; text-align: center }
.u-card-cat { font-size: 0.72rem; font-weight: 500; color: #64748b; text-transform: uppercase; letter-spacing: 0.6px; margin-bottom: 6px }
.u-card-name { font-size: 1.1rem; font-weight: 600; color: #0f172a; margin-bottom: 6px; line-height: 1.35; letter-spacing: -0.1px }
.u-card-price { font-size: 1.6rem; font-weight: 700; color: #0f172a; margin-bottom: 2px; letter-spacing: -0.4px; line-height: 1.1 }
.u-card-unit { display: block; font-size: 0.72rem; font-weight: 400; color: #94a3b8; margin-top: 1px }
.u-card-stock { font-size: 0.82rem; font-weight: 500; color: #64748b; margin-bottom: 16px }
.u-card-act { margin-top: auto; padding-top: 4px }
.u-card-btn { width: 100%; padding: 10px; border-radius: 8px; border: 1px solid #e2e8f0; background: #fff; cursor: pointer; font-size: 0.82rem; font-weight: 500; color: #1e3a5f; transition: all 0.15s }
.u-card-btn:hover { background: #f8fafc; border-color: #cbd5e1 }

.u-empty { display: none; flex-direction: column; align-items: center; justify-content: center; padding: 80px 20px; color: #94a3b8 }
.u-empty p { font-size: 0.9rem; font-weight: 500 }

/* detail modal */
.u-modal { width: 480px; max-width: calc(100vw - 32px); border-radius: 14px }
.u-detail { display: flex; gap: 24px }
.u-detail-img { flex-shrink: 0; width: 160px; height: 160px; border-radius: 12px; overflow: hidden; background: #fafafa }
.u-detail-img img { width: 100%; height: 100%; object-fit: contain; padding: 16px }
.u-detail-info { flex: 1; min-width: 0 }
.u-detail-cat { font-size: 0.72rem; font-weight: 500; color: #64748b; text-transform: uppercase; letter-spacing: 0.6px; margin-bottom: 2px }
.u-detail-name { font-size: 1.2rem; font-weight: 600; color: #0f172a; margin-bottom: 2px; letter-spacing: -0.1px }
.u-detail-price { font-size: 1.5rem; font-weight: 700; color: #0f172a; margin-bottom: 4px; letter-spacing: -0.3px }
.u-detail-unit { display: block; font-size: 0.72rem; font-weight: 400; color: #94a3b8 }
.u-detail-row { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid #f1f5f9 }
.u-detail-row:last-child { border-bottom: none }
.u-detail-label { font-size: 0.82rem; font-weight: 500; color: #64748b }
.u-detail-val { font-size: 0.85rem; font-weight: 500; color: #0f172a }

@media (max-width: 640px) {
  .u-content { padding: 0 16px 60px }
  .u-card-img { width: 130px; height: 130px; padding: 16px }
  .u-detail { flex-direction: column; gap: 16px }
  .u-detail-img { width: 100%; height: 200px; padding: 0 }
}

/* footer */
.site-footer { margin-top: 60px; padding: 48px 32px 32px; border-top: 1px solid #f1f5f9; background: #fafbfc }
.footer-inner { max-width: 1200px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: 48px; justify-content: center; padding: 0 32px }
.footer-col { flex: 1; min-width: 140px; max-width: 260px; text-align: center }
.footer-col h4 { font-size: 0.82rem; font-weight: 600; color: #0f172a; margin-bottom: 8px; letter-spacing: -0.1px }
.footer-col p { font-size: 0.82rem; color: #64748b; line-height: 1.6; font-weight: 400; margin-bottom: 2px }
.footer-bottom { width: 100%; text-align: center; margin-top: 32px; padding-top: 20px }
.footer-divider { display:flex; align-items:center; justify-content:center; margin-bottom: 12px }
.footer-divider span { display:block; width: 80px; height: 1px; background: linear-gradient(90deg,transparent,#cbd5e1,transparent) }
.footer-bottom p { font-size: 0.75rem; color: #94a3b8; font-weight: 400 }
.footer-login { margin-top: 28px }

@media (max-width: 600px) {
  .bar-inner { padding: 0 12px; gap: 10px; }
  .content { padding: 16px 12px 32px; }
  .search-wrap { max-width: none; }
  .brand span { display: none; }
  .row2 { grid-template-columns: 1fr; }
}