body { margin:0; font-family: "Microsoft YaHei", Arial, sans-serif; background:#f5f5f5; color:#333; }
.topbar { background:#f7f7f7; border-bottom:1px solid #eee; font-size:12px; }
.topbar .container { display:flex; justify-content:space-between; padding:6px 0; }
.container { width:1200px; margin:0 auto; }
.header { background:#fff; padding:20px 0 10px; }
.header .logo { font-size:28px; color:#e2231a; font-weight:700; }
.search { flex:1; margin:0 40px; }
.search input { width:70%; padding:10px 12px; border:2px solid #e2231a; border-radius:2px 0 0 2px; }
.search button { padding:10px 20px; background:#e2231a; color:#fff; border:none; border-radius:0 2px 2px 0; cursor:pointer; }
.cart { background:#fff4f4; border:1px solid #e2231a; padding:8px 16px; border-radius:2px; color:#e2231a; font-size:14px; }
.nav { background:#e2231a; color:#fff; }
.nav .container { display:flex; align-items:center; }
.nav .menu { padding:12px 16px; font-weight:700; }
.nav a { color:#fff; margin:0 10px; text-decoration:none; font-size:14px; }
.hero { display:flex; margin-top:15px; }
.categories { width:220px; background:#fff; border:1px solid #eee; }
.categories ul { list-style:none; padding:10px; margin:0; }
.categories li { padding:8px 6px; font-size:13px; border-bottom:1px dashed #f0f0f0; }
.banner { flex:1; background:linear-gradient(135deg,#ff5f6d,#ffc371); padding:20px; border-radius:4px; margin:0 15px; color:#fff; height:360px; }
.banner h2 { margin-top:40px; font-size:28px; }
.banner .coupon { background:#fff; color:#e2231a; padding:10px 16px; border-radius:24px; display:inline-block; margin-top:20px; }
.sidebar { width:260px; background:#fff; border:1px solid #eee; padding:16px; }
.sidebar h3 { margin:0 0 10px; font-size:16px; }
.sidebar .user { background:#fef2f2; padding:12px; border-radius:6px; margin-bottom:12px; }
.section { margin-top:20px; }
.section-title { font-size:20px; margin-bottom:12px; }
.products { display:grid; grid-template-columns:repeat(5,1fr); gap:12px; }
.card { background:#fff; border:1px solid #eee; border-radius:4px; overflow:hidden; }
.card img { width:100%; height:180px; object-fit:cover; }
.card .info { padding:10px; }
.card .name { font-size:14px; height:36px; overflow:hidden; }
.card .price { color:#e2231a; font-weight:700; margin-top:6px; }
.card .actions { margin-top:8px; display:flex; gap:6px; }
.card .actions a { flex:1; text-align:center; padding:6px 0; background:#e2231a; color:#fff; text-decoration:none; border-radius:2px; font-size:12px; }
.card .actions a.secondary { background:#fff4f4; color:#e2231a; border:1px solid #e2231a; }
.footer { margin-top:30px; padding:20px 0; text-align:center; color:#999; font-size:12px; }
.badge { display:inline-block; background:#fff; color:#e2231a; padding:2px 6px; border-radius:10px; font-size:12px; margin-left:6px; }
.form { background:#fff; padding:20px; border-radius:6px; border:1px solid #eee; }
.form label { display:block; margin-top:12px; font-size:14px; }
.form input, .form textarea { width:100%; padding:10px; border:1px solid #ddd; border-radius:4px; margin-top:6px; }
.form button { margin-top:16px; padding:10px 20px; background:#e2231a; color:#fff; border:none; border-radius:4px; cursor:pointer; }
.table { width:100%; border-collapse:collapse; background:#fff; }
.table th, .table td { border:1px solid #eee; padding:10px; font-size:13px; text-align:left; }
.notice { background:#fff7e6; border:1px solid #ffd591; padding:10px; border-radius:4px; margin-bottom:12px; }