/* GENERATED — DO NOT HAND-EDIT.
 *
 * specs/redesign/pages/css/cart-checkout.css, scoped to .csb-ck by
 * tools/scope-mockup-css.py. Same class names, same order, same media
 * queries; only the preview bar, the mockup's own header/footer and its
 * explanatory .disc note are dropped, and its view-state classes
 * (.v--cart / .v--checkout / .v--done / .v--login) are re-pointed at the
 * real <body>.
 *
 * To change anything here, change the mockup and regenerate:
 *   python3 tools/scope-mockup-css.py \
 *     specs/redesign/pages/css/cart-checkout.css .csb-ck \
 *     '.pb,.pv,.phoneframe,.pf-note,.notch,.inframe,.d--phone,.hdr,.hdr-in,.ftr,.ftr-bg,.ftr-in,.fmark,.flinks,.fapp,.badges2,.brand,.mark,.word,.menu,.hcart,.g,.disc,.rule' \
 *     > wp-content/themes/cardsmiths/css/redesign/cart-checkout.css
 */
.csb-ck{--bg:#0b0d10;--s1:#111418;--s2:#181c21;--s3:#1f242a;--line:#272d34;--ink:#eef2f3;--mut:#98a4ab;--dim:#7d8a92;--teal:#15ccad;--tealdk:#0b3d34;--yel:#f5c518;--gold:#d9b44a;--goldline:#8a6d1a;--tw:#9146ff}
.csb-ck *{box-sizing:border-box}
.csb-ck{margin:0;background:#000;color:var(--ink);font:14px/1.5 -apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.csb-ck a{color:var(--teal)}
.csb-ck .appmod{display:flex;align-items:center;gap:12px;flex-wrap:wrap;border:1px solid var(--line);border-radius:12px;background:linear-gradient(90deg,rgba(21,204,173,.10),var(--s1) 60%);padding:11px 14px;margin-top:12px;font-size:13.5px;color:var(--mut)}
.csb-ck .appmod .t{flex:1 1 220px;min-width:180px}
.csb-ck .appmod .t b{color:var(--ink);display:block;font-size:14px}
.csb-ck .appmod .t span{font-size:12.5px}
.csb-ck .appmod .bd{display:flex;gap:6px}
.csb-ck .appmod a.have{font-size:12px;font-weight:700;color:var(--teal);white-space:nowrap}
@media(max-width:600px){
.csb-ck .appmod{padding:10px 12px}
.csb-ck .appmod .bd{width:100%}
}
.csb-ck .if-in{display:none}
body.u--in .csb-ck .if-in{display:inline}
body.u--in .csb-ck .if-out{display:none}
.csb-ck .badge{display:inline-flex;align-items:center;gap:6px;background:#000;color:#fff;border:1px solid #666;border-radius:7px;padding:7px 12px;font-size:11px;line-height:1.1}
.csb-ck .badge b{display:block;font-size:14px}
.csb-ck .badge.sm{padding:5px 10px;font-size:9.5px}
.csb-ck .badge.sm b{font-size:12px}
.csb-ck .page{background:var(--bg);padding:14px 18px 70px}
.csb-ck .wrap{max-width:1100px;margin:0 auto}
.csb-ck .crumb{font-size:12px;color:var(--mut)}
.csb-ck .crumb a{color:var(--mut)}
.csb-ck h1{font-size:28px;margin:8px 0 4px;font-weight:800}
.csb-ck h1 small{color:var(--mut);font-size:15px;font-weight:500;margin-left:10px}
.csb-ck .v{display:none}
body.v--cart .csb-ck .v-cart, body.v--checkout .csb-ck .v-checkout, body.v--done .csb-ck .v-done, body.v--login .csb-ck .v-login{display:block}
.csb-ck .cols{display:grid;grid-template-columns:1fr 360px;gap:22px;align-items:start;margin-top:14px}
.csb-ck .points{display:flex;align-items:center;gap:14px;border:2px solid var(--yel);border-radius:14px;background:linear-gradient(90deg,rgba(245,197,24,.12),var(--s1) 60%);padding:12px 16px;margin-top:12px}
.csb-ck .points .pt{font-size:22px;font-weight:900;color:var(--yel);letter-spacing:-.01em}
.csb-ck .points .t{flex:1}
.csb-ck .points .t b{font-size:15px;display:block}
.csb-ck .points .t span{color:var(--mut);font-size:13px}
.csb-ck .points .sw{position:relative;width:54px;height:30px;border-radius:99px;background:var(--s3);border:1px solid var(--line);cursor:pointer;flex:0 0 auto}
.csb-ck .points .sw i{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#7d8a92;transition:.15s}
body.p--on .csb-ck .points .sw{background:var(--yel);border-color:var(--yel)}
body.p--on .csb-ck .points .sw i{left:27px;background:#111}
.csb-ck .points .lbl{font-weight:800;font-size:13px;white-space:nowrap}
.csb-ck .grp{border:1px solid var(--line);border-radius:14px;background:var(--s1);margin-top:12px;overflow:hidden}
.csb-ck .grp-hd{display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:center;padding:10px 14px 10px 10px;border-bottom:1px solid var(--line)}
.csb-ck .grp-hd .art{width:56px;height:56px;border-radius:8px;background:#0e1216 center/contain no-repeat}
.csb-ck .grp-hd .nm{font-weight:800;font-size:15px;line-height:1.25}
.csb-ck .grp-hd .meta{color:var(--mut);font-size:12px}
.csb-ck .grp-hd .meta b{color:var(--yel)}
.csb-ck .grp-hd .cnt{color:var(--mut);font-size:12.5px;white-space:nowrap}
.csb-ck .li{display:grid;grid-template-columns:34px 1fr auto auto;gap:12px;align-items:center;padding:8px 14px 8px 12px;border-top:1px solid #1c2126}
.csb-ck .li:first-of-type{border-top:0}
.csb-ck .li .lg{width:34px;height:34px;background:transparent center/contain no-repeat}
.csb-ck .li .who{font-weight:700}
.csb-ck .li .who small{display:block;color:var(--dim);font-weight:500;font-size:11.5px}
.csb-ck .li .pr{text-align:right;font-weight:800;white-space:nowrap}
.csb-ck .li .pr s{color:var(--dim);font-weight:500;margin-right:6px}
.csb-ck .li .pr em{display:block;font-style:normal;color:var(--teal);font-size:11px;font-weight:700}
.csb-ck .li .rm{border:1px solid var(--line);background:none;color:var(--dim);width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:14px}
.csb-ck .tier{display:flex;align-items:center;gap:12px;padding:10px 14px;background:rgba(21,204,173,.06);border-top:1px solid var(--line);font-size:13px;color:var(--mut)}
.csb-ck .tier b{color:var(--ink)}
.csb-ck .tier .bar{flex:1;height:8px;border-radius:99px;background:var(--s3);overflow:hidden;max-width:220px}
.csb-ck .tier .bar i{display:block;height:100%;background:var(--teal);width:60%}
.csb-ck .sum{border:1px solid var(--line);border-radius:14px;background:var(--s1);padding:14px 16px;position:sticky;top:14px}
.csb-ck .sum h3{margin:0 0 10px;font-size:16px}
.csb-ck .row{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-top:1px solid #1c2126;font-size:14px;color:var(--mut)}
.csb-ck .row:first-of-type{border-top:0}
.csb-ck .row b{color:var(--ink)}
.csb-ck .row.tot{font-size:18px;color:var(--ink);border-top:2px solid var(--line);margin-top:4px;padding-top:12px}
.csb-ck .row.tot b{font-size:22px}
.csb-ck .row.pts{display:none;color:var(--yel)}
.csb-ck .row.pts b{color:var(--yel)}
body.p--on .csb-ck .row.pts{display:flex}
body.p--on .csb-ck .row.tot b{color:var(--yel)}
.csb-ck .row.disc b{color:var(--teal)}
.csb-ck .ship{margin-top:10px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-size:12.5px;color:var(--mut)}
.csb-ck .ship b{color:var(--ink)}
.csb-ck .ship .free{color:var(--teal);font-weight:800}
.csb-ck .cta{display:block;margin-top:14px;background:var(--yel);color:#111;font-weight:900;border-radius:12px;padding:16px;text-align:center;font-size:17px;text-decoration:none}
.csb-ck .cta small{display:block;font-size:12px;font-weight:700;color:#5b4a00}
.csb-ck .alt{display:block;text-align:center;margin-top:10px;font-size:13px;font-weight:700}
.csb-ck .shipbox{padding:10px 12px}
.csb-ck .sb-hd{font-weight:800;color:var(--ink);font-size:13px;margin-bottom:6px}
.csb-ck .sb-hd small{color:var(--dim);font-weight:600;margin-left:6px}
.csb-ck .sb-opt{display:flex;align-items:center;gap:9px;padding:6px 0;cursor:pointer;font-size:12.5px;color:var(--mut)}
.csb-ck .sb-opt b{color:var(--ink)}
.csb-ck .sb-opt .r{width:15px;height:15px;border-radius:50%;border:2px solid var(--dim);flex:0 0 15px}
.csb-ck .sb-opt.on .r{border:5px solid var(--yel)}
.csb-ck .sb-opt .pr{margin-left:auto;font-weight:800;color:var(--ink);white-space:nowrap}
.csb-ck .sb-opt .pr.free{color:var(--teal)}
.csb-ck .sb-meter{height:6px;border-radius:99px;background:var(--s3);overflow:hidden;margin:4px 0 8px 24px}
.csb-ck .sb-meter i{display:block;height:100%;background:var(--teal)}
.csb-ck .sb-note{color:var(--dim);font-size:11.5px;line-height:1.5;margin-top:8px;border-top:1px solid #1c2126;padding-top:8px}
.csb-ck .sb-grp{margin-bottom:10px}
.csb-ck .sb-grp+.sb-grp{border-top:1px solid #1c2126;padding-top:8px}
.csb-ck .coupon{display:flex;gap:8px;margin-top:12px}
.csb-ck .coupon input{flex:1;background:var(--s2);border:1px solid var(--line);color:var(--ink);border-radius:9px;padding:9px 12px;font:inherit}
.csb-ck .coupon button{border:1px solid var(--line);background:none;color:#c9d1d6;border-radius:9px;padding:9px 12px;font:inherit;font-weight:700}
.csb-ck /* checkout */
  .steps{display:flex;gap:6px;align-items:center;margin-top:10px;font-size:12.5px;color:var(--dim);font-weight:700}
.csb-ck .steps span.on{color:var(--teal)}
.csb-ck .steps i{width:22px;height:1px;background:var(--line);display:inline-block}
.csb-ck .card{border:1px solid var(--line);border-radius:14px;background:var(--s1);padding:14px 16px;margin-top:12px}
.csb-ck .card h3{margin:0 0 4px;font-size:16px}
.csb-ck .card .sub{color:var(--mut);font-size:13px;margin-bottom:10px}
.csb-ck .addr{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--s2)}
.csb-ck .addr .a{flex:1;font-size:13.5px;line-height:1.45}
.csb-ck .addr .a b{display:block}
.csb-ck .addr a{font-size:12.5px;font-weight:700;white-space:nowrap}
.csb-ck .chk{display:flex;align-items:center;gap:10px;margin-top:10px;font-size:13.5px;color:var(--mut)}
.csb-ck .chk i{width:18px;height:18px;border:1px solid var(--line);border-radius:5px;display:inline-block;background:var(--s2)}
.csb-ck .pay{display:flex;flex-direction:column;gap:8px}
.csb-ck .po{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--s2)}
.csb-ck .po.on{border-color:var(--yel);box-shadow:0 0 0 2px rgba(245,197,24,.25)}
.csb-ck .po .r{width:18px;height:18px;border-radius:50%;border:2px solid var(--dim);flex:0 0 18px}
.csb-ck .po.on .r{border:6px solid var(--yel)}
.csb-ck .po b{display:block}
.csb-ck .po span{color:var(--mut);font-size:12.5px}
.csb-ck .po .tag{margin-left:auto;font-size:11px;font-weight:800;letter-spacing:.06em;color:var(--dim)}
.csb-ck .form{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.csb-ck .f{display:flex;flex-direction:column;gap:4px}
.csb-ck .f label{font-size:11.5px;color:var(--dim);font-weight:700}
.csb-ck .f .in{background:var(--s2);border:1px solid var(--line);border-radius:9px;padding:9px 12px;color:#c9d1d6;font-size:14px}
.csb-ck .f.w{grid-column:1/-1}
.csb-ck .notes{margin-top:10px}
.csb-ck .notes .in{min-height:44px;color:var(--dim)}
.csb-ck .mini{margin-top:6px}
.csb-ck .mini .li{grid-template-columns:34px 1fr auto;padding:6px 0}
.csb-ck .mini .grp-hd{padding:8px 0;grid-template-columns:40px 1fr auto}
.csb-ck .mini .grp-hd .art{width:40px;height:40px}
.csb-ck .mini .grp{border:0;background:none;margin:0}
.csb-ck .mini .li .rm{display:none}
.csb-ck .v-done .li .rm, .csb-ck .mini .tier{display:none}
.csb-ck .express{display:none}
body.w--on .csb-ck .express{display:block}
body.w--on .csb-ck .po.express{display:flex}
.csb-ck .ex-row{display:flex;gap:10px;margin-top:12px}
.csb-ck .ex{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;height:46px;border-radius:10px;text-decoration:none;font-weight:800;font-size:16px;border:1px solid #444}
.csb-ck .ex.ap{background:#000;color:#fff}
.csb-ck .ex.gp{background:#fff;color:#111}
.csb-ck .ex.gp b{color:#4285f4}
.csb-ck .ex-or{display:flex;align-items:center;gap:12px;margin:12px 0 0;color:var(--dim);font-size:12px}
.csb-ck .ex-or::before, .csb-ck .ex-or::after{content:"";flex:1;height:1px;background:var(--line)}
.csb-ck .sum .express .ex-row{margin-top:10px}
.csb-ck .sum .express .ex-or{display:none}
.csb-ck .fine{color:var(--dim);font-size:11.5px;margin-top:10px;line-height:1.5}
.csb-ck /* done */
  .hero-done{border:2px solid var(--yel);border-radius:16px;background:linear-gradient(90deg,rgba(245,197,24,.12),var(--s1) 55%);padding:22px 22px;margin-top:14px;display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.csb-ck .hero-done .big{font-size:30px;font-weight:900;line-height:1.05}
.csb-ck .hero-done .big small{display:block;font-size:14px;color:var(--mut);font-weight:600;margin-top:4px}
.csb-ck .hero-done .ok{width:56px;height:56px;border-radius:50%;background:var(--yel);color:#111;display:flex;align-items:center;justify-content:center;font-size:30px;font-weight:900;flex:0 0 56px}
.csb-ck .next{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px}
.csb-ck .nx{border:1px solid var(--line);border-radius:14px;background:var(--s1);padding:14px 16px}
.csb-ck .nx .k{color:var(--teal);font-size:11px;font-weight:800;letter-spacing:.12em}
.csb-ck .nx b{display:block;font-size:16px;margin:4px 0 2px}
.csb-ck .nx span{color:var(--mut);font-size:13px;display:block}
.csb-ck .nx a.b{display:inline-block;margin-top:10px;background:var(--yel);color:#111;font-weight:900;border-radius:9px;padding:9px 14px;text-decoration:none}
.csb-ck .nx a.b.tw{background:var(--tw);color:#fff}
.csb-ck .nx a.l{display:inline-block;margin-top:10px;font-weight:700}
.csb-ck .nx.draft{border-color:var(--yel)}
.csb-ck .receipt{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:12px}
.csb-ck .rc{border:1px solid var(--line);border-radius:12px;background:var(--s1);padding:10px 12px}
.csb-ck .rc .k{color:var(--dim);font-size:11px;font-weight:800;letter-spacing:.1em}
.csb-ck .rc b{display:block;font-size:15px;margin-top:3px}
.csb-ck .appline{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:14px;color:var(--mut);font-size:13.5px}
.csb-ck .appline b{color:var(--ink)}
.csb-ck /* login */
  .login{max-width:440px;margin:24px auto 0}
.csb-ck .login .card h3{font-size:22px}
.csb-ck .login .tabs{display:flex;border:1px solid var(--line);border-radius:99px;padding:3px;background:var(--s2);margin-bottom:12px}
.csb-ck .login .tabs span{flex:1;text-align:center;padding:8px;border-radius:99px;font-weight:700;color:var(--mut)}
.csb-ck .login .tabs span.on{background:var(--teal);color:#04241c}
.csb-ck .login .f{margin-top:8px}
.csb-ck .login .cta{margin-top:14px}
.csb-ck .login .why{color:var(--mut);font-size:13px;margin-top:12px;line-height:1.5}
@media(max-width:900px){
.csb-ck .cols{grid-template-columns:1fr}
.csb-ck .sum{position:static}
.csb-ck .next, .csb-ck .receipt{grid-template-columns:1fr 1fr}
.csb-ck .form{grid-template-columns:1fr}
}
@media(max-width:600px){
.csb-ck .page{padding:10px 10px 90px}
.csb-ck .next, .csb-ck .receipt{grid-template-columns:1fr}
.csb-ck .grp-hd{grid-template-columns:48px 1fr}
.csb-ck .grp-hd .cnt{grid-column:2}
.csb-ck .grp-hd .art{width:48px;height:48px}
.csb-ck .li{grid-template-columns:30px 1fr auto auto;gap:8px;padding:8px 10px}
.csb-ck .points{gap:10px}
.csb-ck .points .pt{font-size:18px}
.csb-ck .stick{position:fixed;left:10px;right:10px;bottom:10px;z-index:5}
.csb-ck .sum .cta{margin-top:10px}
}