/* Sneaks & Stuff — public pages (home, live inventory). Same look as the portals. */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
:root { --ink: #000; --panel: #121212; --panel2: #181818; --line: #262626; --line2: #333; --w: #fff; --red: #E8001C; --green: #2ECC71; --amber: #F5A623; --r: 12px; }
html { -webkit-text-size-adjust: 100%; }
body { background: var(--ink); color: var(--w); font: 400 15px/1.5 'Barlow', system-ui, sans-serif; }
a { color: inherit; }
button, input, select { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; }
input::placeholder { color: #fff; opacity: .5; }

.site-top { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; justify-content: space-between; gap: 12px; height: 64px; padding: 0 max(16px, calc((100vw - 1200px) / 2)); background: rgba(0,0,0,.88); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.brand { display: flex; align-items: center; gap: 11px; text-decoration: none; }
.brand img { width: 38px; height: 38px; border-radius: 50%; }
.brand b { font-size: 17px; font-weight: 700; }
.site-top nav { display: flex; gap: 8px; align-items: center; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 11px 18px; min-height: 44px; border-radius: 9px; border: 1px solid var(--line2); background: var(--panel2); font-weight: 600; font-size: 15px; cursor: pointer; white-space: nowrap; text-decoration: none; }
.btn:hover { border-color: #555; }
.btn.primary { background: var(--red); border-color: var(--red); }
.btn.primary:hover { filter: brightness(1.1); }
.btn.ghost { background: none; }
.btn.sm { padding: 7px 13px; min-height: 36px; font-size: 14px; border-radius: 8px; }

.site-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 22px max(16px, calc((100vw - 1200px) / 2)); border-top: 1px solid var(--line); font-size: 14px; }
.site-foot nav { display: flex; gap: 18px; }
.site-foot a { text-decoration: none; font-weight: 600; }
.site-foot a:hover { text-decoration: underline; text-underline-offset: 3px; }