*{box-sizing:border-box}body{margin:0;background:#f4f6fa;color:#1b2940;font-family:Arial,'Malgun Gothic',sans-serif}header{background:#172e4d;color:white;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:19px 4%}h1{font-size:23px;margin:0 0 5px}small{color:#758399}.account{display:flex;align-items:center;gap:10px}header small{color:#b6c9e0}button{cursor:pointer;border:0;border-radius:8px;background:#e8eff8;color:#174477;padding:10px 13px;font-weight:600}button:disabled{opacity:.5;cursor:not-allowed}button:hover:not(:disabled){filter:brightness(.95)}main{max-width:1250px;margin:auto;padding:22px 16px 100px}.panel,.product{background:white;border:1px solid #e0e6ef;border-radius:13px;padding:18px;margin-bottom:14px}.filters{display:flex;gap:10px;flex-wrap:wrap}input{border:1px solid #cdd7e5;border-radius:8px;padding:11px;font-size:15px;min-width:100px;flex:1}#search{flex:3;min-width:220px}#count{color:#50657f;font-size:14px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:13px}.product{margin:0;display:flex;flex-direction:column;gap:8px}.product h3{margin:4px 0;font-size:17px}.product p{margin:0;font-size:13px;color:#536780;overflow-wrap:anywhere}.product .actions{display:flex;gap:8px;margin-top:auto;padding-top:9px}.actions button{flex:1}.primary,#compare{background:#21528f;color:white}.active{background:#d6f0e7;color:#126047}footer{position:fixed;bottom:0;left:0;right:0;background:white;box-shadow:0 -2px 14px #0002;display:flex;justify-content:center;align-items:center;gap:12px;padding:12px;z-index:5}.overlay{position:fixed;inset:0;background:#0009;z-index:10;display:flex;align-items:center;justify-content:center;padding:15px}.overlay[hidden], [hidden]{display:none!important}.dialog{width:min(1000px,100%);max-height:90vh;overflow:auto;background:white;border-radius:14px;padding:18px}.dialogHead{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:15px}.dialogHead h2{font-size:21px;margin:0}.photo{height:190px;max-height:30vh;background:#edf1f5;color:#95a1b2;border-radius:9px;display:grid;place-items:center;margin-bottom:10px}.details{font-size:14px}.details div{padding:8px 0;border-bottom:1px solid #e9eef3;overflow-wrap:anywhere}.compareGrid{display:flex;gap:12px;overflow-x:auto}.compareItem{min-width:205px;flex:1;border:1px solid #e1e7ee;border-radius:11px;padding:12px}.relation{background:#f4f7fb;padding:14px;border-radius:9px;margin-top:14px}.relation label{display:inline-flex;align-items:center;gap:5px;margin:10px 15px 8px 0}.relation input{flex:none;min-width:0}pre{white-space:pre-wrap;font-size:13px}@media(max-width:650px){header{padding:13px}h1{font-size:17px}main{padding:12px 9px 100px}.grid{grid-template-columns:1fr}.compareItem{min-width:195px}.dialog{padding:12px}.photo{height:155px}.account{font-size:12px}}

.adminLink{display:inline-block;text-decoration:none;background:#e8eff8;color:#174477;border-radius:8px;padding:10px 13px;font-size:13px;font-weight:700}
.adminLink:hover{background:#dbe7f7}
.adminLayout{max-width:1040px;margin:0 auto;padding:25px 15px 50px}
.adminTitle{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.adminTableWrap{overflow-x:auto}
.adminTable{width:100%;border-collapse:collapse;font-size:14px;min-width:650px}
.adminTable th,.adminTable td{padding:12px 10px;text-align:left;border-bottom:1px solid #e3eaf3}
.adminTable th{background:#f5f7fb}
.adminTable button{margin-right:5px;margin-bottom:4px}
.danger{background:#fce9e9;color:#a72d2d}
.statusInactive{color:#9b5d5d}
.adminMsg{font-size:14px;color:#245782;min-height:18px}
.adminForm{display:flex;gap:9px;flex-wrap:wrap;margin-top:12px}
.adminForm input{flex:1;min-width:190px}

#quoteLink{display:inline-block;text-decoration:none;background:#e8eff8;color:#174477;border-radius:8px;padding:10px 13px;font-size:13px;font-weight:700}
/* Unified top navigation buttons */
#historyLink,#adminLink{display:inline-block;text-decoration:none;background:#e8eff8;color:#174477;border-radius:8px;padding:10px 13px;font-size:13px;font-weight:700}
#historyLink:hover,#quoteLink:hover,#adminLink:hover{background:#d7e5f6}

/* v1.2: consistent navigation buttons */
#purchaseLink,#purchaseHistoryLink{display:inline-block;text-decoration:none;background:#e8eff8;color:#174477;border-radius:8px;padding:10px 13px;font-size:13px;font-weight:700;white-space:nowrap}
#purchaseLink:hover,#purchaseHistoryLink:hover{background:#d7e5f6}
.account{flex-wrap:wrap;justify-content:flex-end}

.account a[id$="Link"]{display:inline-flex;align-items:center;justify-content:center;background:#e8eff8!important;color:#174477!important;border-radius:8px;padding:10px 13px;text-decoration:none!important;font-weight:700;font-size:13px;white-space:nowrap}
.account a[id$="Link"]:hover{background:#d7e5f6!important}
/* Product detail recommendation trial */
.gain-recommendations { margin-top:20px; }
.gain-reco-section { border-top:1px solid #ddd; padding:14px 0; }
.gain-reco-section h3 { font-size:16px; margin:0 0 12px; }
.gain-reco-row { display:flex; gap:10px; overflow-x:auto; padding-bottom:10px; scroll-snap-type:x proximity; }
.gain-reco-card { flex:0 0 150px; text-align:left; border:1px solid #ddd; background:white; border-radius:10px; padding:8px; cursor:pointer; scroll-snap-align:start; }
.gain-reco-card strong,.gain-reco-card small { display:block; margin-top:5px; overflow-wrap:anywhere; }
.gain-reco-placeholder { height:100px; background:#f1f1ed; border-radius:7px; display:grid; place-items:center; color:#777; font-size:12px; }
.gain-reco-empty { color:#777; font-size:13px; }