body{font-family:sans-serif;margin:0;background:#fff;color:#222}
.topbar{display:flex;justify-content:center;align-items:center;padding:14px;border-bottom:1px solid #eee}
.logo{font-weight:800;font-size:22px}
.logo span{color:#d8082e}
.container{max-width:1000px;margin:auto;padding:20px}
h1{color:#d8082e;font-size:26px;margin-bottom:10px}
.tabs{display:flex;gap:10px;margin-bottom:16px}
.tab-btn{flex:1;padding:10px;border:1px solid #eee;border-radius:8px;background:#fff;font-weight:600;cursor:pointer}
.tab-btn.active{background:#d8082e;color:#fff;border-color:#d8082e}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.product{border:1px solid #eee;border-radius:12px;padding:12px;text-align:center;transition:transform .2s,box-shadow .2s}
.product.added{border-color:#d8082e;box-shadow:0 0 10px rgba(216,8,46,.4)}
.btn{padding:10px 14px;border:none;border-radius:10px;cursor:pointer;font-weight:600}
.btn.primary{background:#d8082e;color:#fff}
.btn.ghost{border:1px solid #d8082e;color:#d8082e;background:#fff}
.btn.black{background:#000;color:#fff;width:100%;margin-top:10px}
.bottombar{position:fixed;bottom:0;left:0;width:100%;background:#fff;border-top:1px solid #eee;display:flex;justify-content:space-around;padding:10px 0;z-index:100}
.bottom-btn{background:#d8082e;color:#fff;border:none;border-radius:8px;padding:10px 20px;font-size:15px;font-weight:600;cursor:pointer;transition:background .2s}
.bottom-btn:hover{background:#b30724}
.popup{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.4);display:flex;align-items:center;justify-content:center;z-index:200}
.popup.hidden{display:none}
.popup-content{background:#fff;border-radius:14px;width:90%;max-width:420px;box-shadow:0 5px 20px rgba(0,0,0,0.2);display:flex;flex-direction:column}
.popup-content.small{max-width:300px}
.popup-header{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid #eee}
.popup-body{padding:10px 16px;flex:1;overflow:auto;max-height:50vh;display:flex;flex-direction:column;gap:10px}
.popup-footer{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;padding:14px 16px;border-top:1px solid #eee}
.icon-btn{background:none;border:none;font-size:18px;cursor:pointer}
.itemRow{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;border-bottom:1px solid #f1f1f1;padding-bottom:4px}
label{font-size:14px;font-weight:600;margin-top:6px}
input{width:100%;padding:8px;border:1px solid #ddd;border-radius:8px}
.row{display:flex;gap:10px}