:root {
  color-scheme: dark;
  --bg: #08090a;
  --panel: #111315;
  --line: rgba(255,255,255,.12);
  --text: #f4f1ea;
  --muted: #9da1a5;
  --red: #ed2d25;
  --orange: #ff6b1a;
  --green: #69c37d;
}
* { box-sizing: border-box; }
html { min-height: 100%; background: var(--bg); }
body { margin: 0; min-height: 100vh; color: var(--text); background: radial-gradient(circle at 75% 12%, rgba(237,45,37,.16), transparent 32rem), linear-gradient(135deg,#070809,#0c0d0f 60%,#111); font-family: Inter,Segoe UI,Arial,sans-serif; font-size:16px; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.18; background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px); background-size:42px 42px; mask-image:linear-gradient(to bottom,#000,transparent 75%); }
.topbar { height:84px; padding:0 clamp(22px,5vw,80px); border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; position:relative; z-index:2; }
.brand { color:inherit; text-decoration:none; display:flex; align-items:center; gap:13px; letter-spacing:.08em; }
.brand-mark { width:32px; height:32px; border:2px solid var(--red); transform:rotate(45deg); position:relative; }
.brand-mark::after { content:""; position:absolute; inset:7px; background:var(--red); }
.brand span:last-child { display:flex; flex-direction:column; }
.brand b { font-size:15px; }
.brand small { color:var(--muted); font-size:9px; letter-spacing:.22em; margin-top:2px; }
.back { color:var(--muted); text-decoration:none; font-size:14px; }
.back:hover { color:var(--text); }
.service-nav { display:flex; align-items:center; gap:6px; }
.service-nav a { color:var(--muted); text-decoration:none; padding:10px 12px; font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.service-nav a:hover { color:var(--text); background:rgba(237,45,37,.12); }
main { width:min(1240px,calc(100% - 40px)); margin:0 auto; position:relative; z-index:1; }
.eyebrow { color:var(--orange)!important; font-weight:800; font-size:12px!important; letter-spacing:.22em; }
h1 { font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif; text-transform:uppercase; font-size:clamp(54px,8vw,112px); line-height:.84; letter-spacing:.015em; margin:24px 0 28px; font-weight:400; }
h1 em { color:transparent; -webkit-text-stroke:1px var(--red); font-style:normal; }
.login-shell { min-height:calc(100vh - 140px); display:grid; grid-template-columns:minmax(0,1.45fr) minmax(260px,.55fr); align-items:center; gap:7vw; padding:60px 0; }
.login-copy>p:not(.eyebrow), .message-shell>p, .setup>p { color:var(--muted); font-size:18px; line-height:1.65; max-width:650px; }
.steam-button { display:inline-flex; align-items:center; gap:12px; padding:17px 24px; margin-top:20px; background:linear-gradient(135deg,#27638f,#17374e); color:white; text-decoration:none; font-weight:800; border:1px solid rgba(255,255,255,.2); transition:.2s ease; }
.steam-button:hover { transform:translateY(-2px); filter:brightness(1.15); }
.steam-button span { font-size:24px; }
.steam-button.compact { margin-top:28px; }
.login-copy>small { display:block; color:#777d82; margin-top:14px; max-width:520px; line-height:1.5; }
.login-shell aside { border-left:1px solid var(--line); display:grid; grid-template-columns:50px 1fr; gap:28px 20px; padding:40px; background:rgba(255,255,255,.025); }
.login-shell aside span { color:var(--red); font-weight:900; }
.login-shell aside b { font-size:17px; }
.message-shell, .setup { max-width:880px; padding:12vh 0; }
.message-shell h1, .setup h1 { font-size:clamp(48px,7vw,86px); }
.text-button { border:0; background:none; color:var(--muted); padding:16px 0; cursor:pointer; text-decoration:underline; font:inherit; }
.shop-head { display:flex; align-items:flex-end; justify-content:space-between; gap:40px; padding:70px 0 45px; }
.shop-head h1 { font-size:clamp(58px,8vw,100px); margin-bottom:0; }
.account { min-width:340px; border:1px solid var(--line); background:rgba(255,255,255,.035); padding:18px; display:grid; grid-template-columns:56px 1fr auto; gap:14px; align-items:center; }
.avatar { width:56px; height:56px; background:#202326; display:grid; place-items:center; color:var(--red); font-weight:900; overflow:hidden; }
.avatar img { width:100%; height:100%; object-fit:cover; }
.account>div:nth-child(2) { display:flex; flex-direction:column; min-width:0; }
.account small { color:var(--muted); font-size:9px; letter-spacing:.16em; }
.account b { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:180px; margin:4px 0; }
.account span { color:var(--orange); font-size:13px; font-weight:800; }
.account div small:last-child { margin-top:4px; letter-spacing:.04em; }
.account button { background:none; border:0; color:#777; cursor:pointer; font-size:12px; }
.catalog-nav { position:sticky; top:0; z-index:3; display:flex; gap:8px; overflow:auto; padding:12px; margin:0 0 44px; border:1px solid var(--line); background:rgba(8,9,10,.94); backdrop-filter:blur(12px); }
.catalog-nav a { flex:0 0 auto; color:var(--muted); text-decoration:none; padding:10px 14px; border:1px solid transparent; font-size:13px; font-weight:800; }
.catalog-nav a:hover { color:var(--text); border-color:rgba(237,45,37,.5); }
.catalog-section { scroll-margin-top:82px; padding:0 0 58px; }
.catalog-heading { display:grid; grid-template-columns:1fr auto; align-items:end; gap:4px 20px; margin-bottom:20px; padding-bottom:16px; border-bottom:1px solid var(--line); }
.catalog-heading .eyebrow { grid-column:1/-1; margin:0; }
.catalog-heading h2 { margin:0; font-size:32px; }
.catalog-heading>span { color:var(--muted); font-size:13px; }
.products { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.product { min-height:290px; padding:28px; border:1px solid var(--line); background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.015)); display:flex; flex-direction:column; transition:.2s ease; }
.product:hover { transform:translateY(-3px); border-color:rgba(237,45,37,.5); }
.product-top { display:flex; justify-content:space-between; align-items:flex-start; }
.product-top>div { display:flex; flex-wrap:wrap; gap:6px; }
.product-top>div>span { font-size:9px; letter-spacing:.14em; color:var(--orange); font-weight:900; border:1px solid rgba(255,107,26,.25); padding:5px 6px; }
.product-top>b { font-size:22px; }
.product-top small { font-size:10px; color:var(--muted); }
.product h3 { font-size:25px; margin:42px 0 12px; }
.product p { color:var(--muted); line-height:1.55; margin:0 0 24px; }
.product form { margin-top:auto; }
.product button, .setup button { width:100%; padding:14px 18px; color:white; background:var(--red); border:0; font-weight:900; cursor:pointer; font-size:15px; }
.product button:hover, .setup button:hover { background:#ff3a31; }
.product button:disabled { cursor:not-allowed; background:#272a2d; color:#74787c; }
.flash { padding:16px 20px; margin:0 0 20px; border:1px solid rgba(105,195,125,.45); background:rgba(105,195,125,.1); color:#bde9c7; }
.flash.error { border-color:rgba(237,45,37,.5); background:rgba(237,45,37,.1); color:#ffaaa5; }
.active-effect { display:flex; justify-content:space-between; gap:24px; align-items:center; margin:0 0 20px; padding:18px 20px; border:1px solid rgba(255,107,26,.55); background:rgba(255,107,26,.1); }
.active-effect b { color:#ff9a5d; }
.active-effect span { color:#ffd2b7; }
.return { border-top:1px solid var(--line); padding:28px 0 70px; display:flex; gap:20px; justify-content:space-between; color:var(--muted); }
.return b { color:var(--text); }
.history { display:grid; grid-template-columns:280px 1fr; gap:40px; border-top:1px solid var(--line); padding:42px 0; }
.history h2 { margin:8px 0 0; font-size:28px; }
.history ul { list-style:none; padding:0; margin:0; border:1px solid var(--line); }
.history li { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:14px 18px; border-bottom:1px solid var(--line); }
.history li:last-child { border-bottom:0; }
.history li span { display:flex; flex-direction:column; gap:4px; }
.history li small { color:var(--muted); }
.history strong.plus { color:var(--green); }
.history strong.minus { color:#ff8e87; }
.empty-history { color:var(--muted); }
.empty { grid-column:1/-1; padding:60px; text-align:center; border:1px solid var(--line); color:var(--muted); }
.setup form { margin-top:36px; max-width:600px; display:grid; gap:18px; }
.setup label { display:grid; gap:8px; color:var(--muted); font-size:14px; }
.setup label small { color:#666; }
.setup input { width:100%; border:1px solid var(--line); background:#101214; color:white; padding:14px; font:inherit; }
.setup input:focus { outline:2px solid rgba(237,45,37,.45); outline-offset:1px; }
footer { width:min(1240px,calc(100% - 40px)); margin:0 auto; padding:25px 0; border-top:1px solid var(--line); color:#666; font-size:10px; letter-spacing:.18em; }
.bazaar-hero { padding:64px 0 38px; display:flex; align-items:flex-end; justify-content:space-between; gap:40px; }
.bazaar-hero h1,.bazaar-admin-head h1 { font-size:clamp(54px,8vw,96px); margin:18px 0 20px; }
.bazaar-hero>div>p:last-child { color:var(--muted); max-width:650px; line-height:1.6; }
.bazaar-hero aside { min-width:280px; border:1px solid var(--line); border-left:3px solid var(--red); padding:20px; display:flex; flex-direction:column; gap:7px; background:rgba(255,255,255,.035); }
.bazaar-hero aside small { color:var(--muted); letter-spacing:.14em; font-size:10px; }.bazaar-hero aside span { color:var(--orange); font-weight:900; }
.bazaar-tabs { position:sticky; top:0; z-index:5; display:flex; overflow-x:auto; gap:4px; padding:9px; border:1px solid var(--line); background:rgba(8,9,10,.96); backdrop-filter:blur(14px); }
.bazaar-tabs a { flex:0 0 auto; padding:11px 13px; color:var(--muted); text-decoration:none; font-size:11px; font-weight:900; letter-spacing:.05em; }
.bazaar-tabs a:hover,.bazaar-tabs a.active { color:#fff; background:var(--red); }
.bazaar-content { padding:32px 0 80px; }.bazaar-filter { display:grid; grid-template-columns:2fr repeat(3,1fr) auto; gap:10px; margin-bottom:24px; padding:18px; border:1px solid var(--line); background:rgba(255,255,255,.025); }
.bazaar-filter label,.sell-card label,.admin-grid label { display:grid; gap:7px; color:var(--muted); font-size:9px; font-weight:900; letter-spacing:.12em; }
.bazaar-filter input,.bazaar-filter select,.sell-card input,.sell-card select,.admin-grid input,.admin-grid select { width:100%; min-height:42px; padding:10px; border:1px solid var(--line); color:#fff; background:#0d0f11; font:inherit; }
.bazaar-filter button,.bazaar-card button,.sell-card button,.bazaar-table button,.admin-grid button,.admin-list button { border:0; padding:12px 16px; color:#fff; background:var(--red); font-weight:900; cursor:pointer; }
.bazaar-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }.bazaar-card,.sell-card { border:1px solid var(--line); padding:22px; background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.012)); }
.bazaar-card h3,.sell-card h3 { margin:18px 0 8px; font-size:23px; }.bazaar-card>p,.sell-card>p { color:var(--muted); }.item-icon { width:72px;height:72px;display:grid;place-items:center;border:1px solid rgba(237,45,37,.5);background:radial-gradient(circle,rgba(237,45,37,.25),#101214 70%);color:#ff5b53;font-size:38px;font-weight:900; }
.item-icon.small { width:48px;height:48px;font-size:25px; }.item-tags { display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}.item-tags span,.bazaar-status { border:1px solid var(--line);padding:5px 7px;color:var(--orange);font-size:9px;font-weight:900;letter-spacing:.08em; }
.bazaar-card dl { display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:22px 0}.bazaar-card dl div { padding:10px;background:rgba(255,255,255,.035)}.bazaar-card dt { color:var(--muted);font-size:9px}.bazaar-card dd { margin:6px 0 0;font-weight:900;font-size:12px}.bazaar-card form { display:flex;gap:8px;margin-top:9px}.bazaar-card form button { flex:1}.bazaar-card .bid-form input { min-width:0;width:42%;background:#0d0f11;border:1px solid var(--line);color:white;padding:10px}.sell-grid { display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.sell-card form,.admin-grid form { display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:20px}.sell-card form button,.admin-grid form button,.sell-card form h2,.admin-grid form h2 { grid-column:1/-1}.bazaar-empty { grid-column:1/-1;padding:60px 24px;text-align:center;border:1px dashed var(--line);color:var(--muted) }
.bazaar-table { border:1px solid var(--line) }.bazaar-table article,.admin-list article { display:grid;grid-template-columns:auto 1fr auto auto auto;align-items:center;gap:14px;padding:14px;border-bottom:1px solid var(--line)}.bazaar-table article:last-child,.admin-list article:last-child{border-bottom:0}.bazaar-table article>div:nth-child(2),.admin-list article span{display:flex;flex-direction:column;gap:5px}.bazaar-table small,.admin-list small{color:var(--muted)}.bazaar-table button.secondary{background:#292c2f}.status-delivered,.status-won,.status-listed{color:var(--green);border-color:rgba(105,195,125,.4)}.status-pending,.status-delivery_pending,.status-return_pending{color:#ffc46f}.wallet-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:32px 0}.wallet-cards article{padding:22px;border:1px solid var(--line);border-top:3px solid var(--red);background:rgba(255,255,255,.025);display:flex;flex-direction:column;gap:10px}.wallet-cards small{color:var(--muted);font-size:9px;letter-spacing:.12em}.wallet-cards b{font-size:25px}.bazaar-admin-head{padding:60px 0 10px}.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.admin-grid form,.admin-list{padding:22px;border:1px solid var(--line);background:rgba(255,255,255,.025)}.admin-list{margin:24px 0}.admin-list h2{margin-top:0}
@media(max-width:900px){.login-shell{grid-template-columns:1fr}.login-shell aside{display:none}.shop-head{align-items:stretch;flex-direction:column}.account{min-width:0}.products{grid-template-columns:1fr 1fr}.history{grid-template-columns:1fr}}
@media(max-width:1000px){.bazaar-filter{grid-template-columns:1fr 1fr}.bazaar-grid{grid-template-columns:1fr 1fr}.service-nav a{padding:8px 7px}.wallet-cards{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.service-nav{max-width:65vw;overflow-x:auto}.service-nav a{font-size:10px}.bazaar-hero{align-items:stretch;flex-direction:column}.bazaar-hero aside{min-width:0}.bazaar-grid,.sell-grid,.admin-grid{grid-template-columns:1fr}.bazaar-filter{grid-template-columns:1fr}.bazaar-table article,.admin-list article{grid-template-columns:auto 1fr}.bazaar-table article form,.bazaar-table article .bazaar-status,.admin-list article form{grid-column:2}.wallet-cards{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.topbar{height:auto;min-height:70px;padding:12px 14px;gap:15px}.brand span:last-child{display:none}main{width:min(100% - 28px,1240px)}h1{font-size:50px}.login-shell{min-height:auto;padding:80px 0}.products{grid-template-columns:1fr}.account{grid-template-columns:48px 1fr}.account form{grid-column:2}.product{min-height:250px}.return,.active-effect{flex-direction:column;align-items:flex-start}.catalog-heading{grid-template-columns:1fr}.catalog-heading>span{margin-top:5px}.brand-mark{width:26px;height:26px}.wallet-cards{grid-template-columns:1fr}.sell-card form,.admin-grid form{grid-template-columns:1fr}.sell-card form button,.admin-grid form button{grid-column:auto}}
