.crumb{max-width:var(--wrap);margin:0 auto;padding:var(--s-4) var(--s-5) 0}
.crumb ol{display:flex;flex-wrap:wrap;gap:6px;font-size:var(--t-xs);color:var(--ink-faint);list-style:none;margin:0;padding:0}
.crumb li:not(:last-child)::after{content:'/';margin-left:6px;color:var(--line)}
.crumb li[aria-current]{color:var(--fg);font-weight:600}

.cartpg{max-width:var(--wrap);margin:0 auto;padding:var(--s-4) var(--s-5) var(--s-8)}
.cartpg h1{font-size:clamp(1.4rem,2.6vw,1.8rem);font-weight:800;margin-bottom:var(--s-5)}
.cartpg h1 span{color:var(--ink-faint);font-weight:400;font-size:var(--t-lg)}

.cartpg__layout{display:grid;grid-template-columns:1fr 380px;gap:var(--s-6);align-items:start}

.cartpg__ship{border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s-4);margin-bottom:var(--s-4)}
.cartpg__ship[hidden]{display:none}
.cartpg__ship p{font-size:var(--t-sm);margin-bottom:var(--s-2)}
.cartpg__ship p b{font-weight:700}
.cartpg__shipbar{height:5px;border-radius:3px;background:var(--surface);overflow:hidden}
.cartpg__shipbar i{display:block;height:100%;width:0;background:var(--ok);transition:width var(--d-slow) var(--e-out)}

.cartpg__empty{display:none;flex-direction:column;align-items:center;text-align:center;gap:var(--s-3);padding:var(--s-8) var(--s-4)}
.cartpg__empty[data-shown]{display:flex}
.cartpg__empty svg{width:56px;height:56px;color:var(--line);margin-bottom:var(--s-2)}
.cartpg__empty h2{font-size:var(--t-lg);font-weight:700}
.cartpg__empty p{color:var(--ink-faint);font-size:var(--t-sm);margin-bottom:var(--s-3)}
.cartpg__empty .btn--solid{border-radius:var(--r-sm);padding-inline:2rem}

.cartpg__list{display:flex;flex-direction:column}
.ci2{display:grid;grid-template-columns:110px 1fr;gap:var(--s-4);padding:var(--s-4) 0;border-bottom:1px solid var(--line)}
.ci2:first-child{padding-top:0}
.ci2 img{width:110px;height:140px;object-fit:cover;border-radius:var(--r-sm);background:var(--surface)}
.ci2__top{display:flex;justify-content:space-between;gap:var(--s-3)}
.ci2__name{font-size:var(--t-base);font-weight:600;line-height:1.35}
.ci2__size{font-size:var(--t-sm);color:var(--ink-faint);margin-top:4px}
.ci2__unit{font-size:var(--t-sm);color:var(--ink-faint);margin-top:4px}
.ci2__linetotal{font-weight:700;font-size:var(--t-lg);white-space:nowrap;font-variant-numeric:tabular-nums}
.ci2__bottom{display:flex;align-items:center;justify-content:space-between;margin-top:var(--s-3)}
.ci2__q{display:flex;align-items:center;gap:2px;border:1px solid var(--line);border-radius:var(--r-pill);padding:2px}
.ci2__q button{width:32px;height:32px;display:grid;place-items:center;border-radius:var(--r-pill);font-size:1.1rem;transition:background var(--d-fast) linear}
.ci2__q button:hover{background:var(--surface)}
.ci2__q span{min-width:28px;text-align:center;font-size:var(--t-sm);font-variant-numeric:tabular-nums}
.ci2__rm{display:flex;align-items:center;gap:6px;font-size:var(--t-sm);color:var(--ink-faint);transition:color var(--d-fast) linear}
.ci2__rm svg{width:16px;height:16px}
.ci2__rm:hover{color:var(--red)}
.ci2.leaving{animation:ciOut var(--d-mid) var(--e-out) forwards}
@keyframes ciOut{to{opacity:0;transform:translateX(24px);height:0;padding:0;border:0;margin:0}}

.cartpg__summary{position:sticky;top:calc(var(--nav-h) + 16px);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s-5)}
.cartpg__summary h2{font-size:var(--t-lg);font-weight:700;margin-bottom:var(--s-4)}
.sumrow{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--s-3);font-size:var(--t-sm)}
.sumrow[hidden]{display:none}
.sumrow b{font-weight:700;font-variant-numeric:tabular-nums}
.sumrow--coupon{gap:8px}
.sumrow--coupon input{flex:1;height:40px;padding:0 .8rem;border:1.5px solid var(--line);border-radius:var(--r-sm);font-size:var(--t-sm);background:var(--paper);color:var(--fg)}
.sumrow--coupon input:focus{outline:none;border-color:var(--ink)}
.sumrow--coupon .btn--outline{height:40px;padding-inline:1rem;font-size:12px;border-radius:var(--r-sm)}
.sumrow__err{min-height:1.1rem;font-size:var(--t-xs);color:var(--red);margin:-6px 0 var(--s-3)}

.couponlist{margin:0 0 var(--s-4);border:1px dashed var(--line);border-radius:var(--r-sm);padding:var(--s-3)}
.couponlist__label{font-size:var(--t-xs);font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-faint);margin-bottom:var(--s-2)}
.couponlist__item{display:flex;justify-content:space-between;align-items:center;gap:var(--s-2);padding:var(--s-2) 0;border-top:1px solid var(--line)}
.couponlist__item:first-of-type{border-top:0}
.couponlist__info{display:flex;flex-direction:column;min-width:0}
.couponlist__code{font-family:var(--f-head);font-weight:800;font-size:var(--t-sm);letter-spacing:.03em;color:var(--red)}
.couponlist__desc{font-size:11.5px;color:var(--ink-faint);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.couponlist__btn{flex:none;height:32px;padding-inline:.9rem;font-size:11px;font-weight:800;letter-spacing:.03em;color:var(--ink);border:1.5px solid var(--ink);border-radius:var(--r-sm);background:transparent;transition:background var(--d-fast) linear,color var(--d-fast) linear}
.couponlist__btn:hover{background:var(--ink);color:#fff}
.couponlist__applied{flex:none;font-size:11px;font-weight:800;letter-spacing:.03em;color:var(--ok)}
.couponlist__item.is-applied .couponlist__code{color:var(--ok)}
.sumrow--discount b{color:var(--ok)}
.sumrow--total{padding-top:var(--s-3);border-top:1px solid var(--line);margin-top:var(--s-2);margin-bottom:var(--s-4)}
.sumrow--total span{font-weight:700;font-size:var(--t-base)}
.sumrow--total b{font-size:1.3rem}
.cartpg__summary .btn--full{border-radius:var(--r-sm);height:50px}
.cartpg__summary .btn--full[aria-disabled="true"]{opacity:.5;pointer-events:none}
.cartpg__secure{display:flex;align-items:center;justify-content:center;gap:6px;font-size:var(--t-xs);color:var(--ink-faint);margin-top:var(--s-3)}
.cartpg__secure svg{width:15px;height:15px}

@media (max-width:1550px){ :root{--wrap:calc(100% - 64px)} }
@media (max-width:1190px){ .cartpg__layout{grid-template-columns:1fr 320px} }
@media (max-width:920px){ .cartpg__layout{grid-template-columns:1fr;gap:var(--s-4)} .cartpg__summary{position:static} }
@media (max-width:720px){
  .crumb,.cartpg{padding-inline:var(--s-3)}
  .ci2{grid-template-columns:84px 1fr;gap:var(--s-3)}
  .ci2 img{width:84px;height:106px}
  .ci2__name{font-size:var(--t-sm)}
  .ci2__linetotal{font-size:var(--t-base)}
}
@media (max-width:420px){
  .ci2__top{flex-direction:column;gap:4px}
  .ci2__linetotal{align-self:flex-start}
  .cartpg__summary{padding:var(--s-4)}
}
@media (max-width:380px){
  .sumrow--coupon{flex-direction:column;align-items:stretch}
  .sumrow--coupon input{width:100%}
  .sumrow--coupon .btn--outline{width:100%}
  .couponlist__item{flex-direction:column;align-items:stretch;gap:6px}
  .couponlist__btn,.couponlist__applied{align-self:flex-start}
}
@media (max-width:320px){
  .crumb,.cartpg{padding-inline:10px}
  .ci2{grid-template-columns:70px 1fr;gap:10px}
  .ci2 img{width:70px;height:90px}
}