.ocba-wrap{margin:30px 0;padding:22px;border:1px solid #e7e7e7;border-radius:16px;background:#fafafa;overflow:hidden}.ocba-row{display:flex;align-items:center;gap:18px;flex-wrap:wrap}.ocba-left{min-width:170px;max-width:220px;text-align:center;color:#f26422;font-weight:500;line-height:1.35}.ocba-left-title{font-size:16px;margin-bottom:8px}.ocba-left-saving{font-size:18px;font-weight:700}.ocba-items{display:flex;align-items:center;gap:18px;flex:1;flex-wrap:wrap}.ocba-plus,.ocba-equal{font-size:34px;line-height:1;color:#f26422;font-weight:300}.ocba-card{width:210px;max-width:210px;background:#fff;border:1.5px solid #f26422;border-radius:16px;padding:14px 14px 12px;text-align:center;position:relative;transition:all .2s ease}.ocba-card.ocba-main{border-color:#d7d7d7}.ocba-badge{position:absolute;left:50%;top:-14px;transform:translateX(-50%);background:#fff;border:1.5px solid #f26422;color:#f26422;border-radius:999px;padding:6px 14px;font-size:12px;font-weight:700;white-space:nowrap}.ocba-image{display:block;width:100%;height:220px;object-fit:contain;margin:0 auto 12px auto}.ocba-name{display:block;min-height:44px;font-size:15px;line-height:1.4;color:#222;text-decoration:none;margin-bottom:8px}.ocba-name:hover{text-decoration:none;color:#f26422}.ocba-old{display:block;color:#f26422;text-decoration:line-through;font-weight:700;font-size:15px;line-height:1.3}.ocba-new{display:block;color:#099b1f;font-weight:800;font-size:16px;line-height:1.3}.ocba-summary{width:210px;min-width:210px;background:#fff;border:1.5px solid #f26422;border-radius:16px;padding:20px 16px;text-align:center}.ocba-summary-total{font-size:16px;color:#f26422;margin-bottom:18px}.ocba-summary-total strong{font-size:18px}.ocba-btn{display:inline-block;width:100%;padding:14px 12px;border:none;border-radius:12px;background:#f26422;color:#fff;font-size:16px;font-weight:700;cursor:pointer;transition:all .2s ease}.ocba-btn:hover{opacity:.92}.ocba-btn:disabled{opacity:.6;cursor:not-allowed}.ocba-message{margin-top:14px;font-size:13px;color:#666;text-align:center;display:none}@media (max-width:1199px){.ocba-row{justify-content:center}.ocba-left{max-width:none;width:100%}.ocba-items{justify-content:center}.ocba-summary{width:100%;max-width:320px}}@media (max-width:767px){.ocba-wrap{padding:16px;border-radius:12px}.ocba-items{gap:12px}.ocba-card{width:100%;max-width:280px}.ocba-plus,.ocba-equal{width:100%;text-align:center;font-size:26px}}
.ocba-left-note{font-size:12px;color:#777;margin-top:8px}.ocba-badge{max-width:85%;overflow:hidden;text-overflow:ellipsis}
@media (max-width: 991px){.ocba-row{display:block}.ocba-left{width:100%;max-width:none;margin-bottom:16px}.ocba-items{display:flex;flex-wrap:wrap;justify-content:center}.ocba-summary{width:100%;max-width:360px;margin-top:8px}}
@media (max-width: 575px){.ocba-wrap{padding:14px}.ocba-items{display:block}.ocba-card,.ocba-summary{width:100%;max-width:none;min-width:0}.ocba-card{margin-bottom:12px}.ocba-plus,.ocba-equal{display:block;width:100%;text-align:center;margin:6px 0}.ocba-image{height:180px}.ocba-btn{width:100%}}

/* v8.4.5 layout stability fix */
@media (min-width: 992px){
  .ocba-wrap{overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch;}
  .ocba-row{flex-wrap:nowrap;align-items:stretch;min-width:max-content;}
  .ocba-left{flex:0 0 220px;min-width:220px;max-width:220px;display:flex;flex-direction:column;justify-content:center;}
  .ocba-items{flex:1 1 auto;flex-wrap:nowrap;justify-content:flex-start;align-items:center;min-width:max-content;}
  .ocba-card{flex:0 0 210px;width:210px;max-width:210px;}
  .ocba-summary{flex:0 0 210px;width:210px;min-width:210px;margin-top:0;}
  .ocba-plus,.ocba-equal{flex:0 0 auto;}
}


/* v8.4.6 smart desktop fit fix */
@media (min-width: 992px) and (max-width: 1399px){
  .ocba-wrap{padding:18px;}
  .ocba-row{gap:12px;}
  .ocba-left{flex:0 0 clamp(150px, 15vw, 190px);min-width:clamp(150px, 15vw, 190px);max-width:clamp(150px, 15vw, 190px);}
  .ocba-items{gap:12px;}
  .ocba-card{flex:0 0 clamp(170px, 18vw, 195px);width:clamp(170px, 18vw, 195px);max-width:clamp(170px, 18vw, 195px);padding:12px 12px 10px;}
  .ocba-summary{flex:0 0 clamp(180px, 19vw, 205px);width:clamp(180px, 19vw, 205px);min-width:clamp(180px, 19vw, 205px);padding:18px 14px;}
  .ocba-image{height:190px;}
  .ocba-name{font-size:14px;min-height:56px;}
  .ocba-old{font-size:14px;}
  .ocba-new{font-size:15px;}
  .ocba-summary-total{font-size:15px;margin-bottom:14px;}
  .ocba-summary-total strong{font-size:17px;}
  .ocba-btn{font-size:15px;padding:13px 10px;}
  .ocba-plus,.ocba-equal{font-size:28px;}
}

@media (min-width: 1400px){
  .ocba-row{gap:16px;}
  .ocba-items{gap:16px;}
}