.bb{display:block;--bb-line: var(--ol-line, rgba(46,36,30,.14));--bb-ink: var(--ol-espresso, #2e241e);--bb-mute: var(--ol-muted, #766150);--bb-panel: var(--ol-paper, #f7f3ec);background:var(--ol-linen, #efe8de);color:var(--bb-ink)}.bb button{font:inherit}.bb button:not(.ol-btn){color:inherit}.bb__top{display:grid;gap:8px 48px;padding:32px var(--ol-gutter, 16px) 24px;border-bottom:1px solid var(--bb-line)}.bb__title{font:400 var(--ol-t-h2)/1.05 var(--ol-serif);margin:0;letter-spacing:-.01em}.bb__intro{margin:0;max-width:46ch;color:var(--bb-mute);font-size:16px;line-height:1.55;align-self:end}@container bb (min-width: 1080px){.bb__top{grid-template-columns:1fr auto;padding-top:40px}}.bb__grid{display:grid;grid-template-columns:minmax(0,1fr)}.bb__wrap{overflow-x:clip}.bb__steps,.bb__sum,.bb__stagewrap,.bb__step{min-width:0}@container bb (min-width: 1080px){.bb__grid{grid-template-columns:minmax(340px,400px) minmax(0,1fr) minmax(300px,360px);grid-template-areas:"steps stage sum";align-items:start}.bb__steps{grid-area:steps;border-right:1px solid var(--bb-line)}.bb__stagewrap{grid-area:stage;position:sticky;top:var(--header-height, 72px)}.bb__sum{grid-area:sum;position:sticky;top:var(--header-height, 72px);border-left:1px solid var(--bb-line)}}.bb__wrap{container:bb / inline-size}.bb__stagewrap{padding:16px var(--ol-gutter, 16px) 20px;background:var(--ol-linen, #efe8de)}.bb__stage{position:relative;aspect-ratio:1;width:min(100%,calc(100svh - var(--header-height, 72px) - 96px));margin-inline:auto;background:radial-gradient(60% 46% at 50% 92%,rgba(46,36,30,.1),transparent 70%)}.bb__bag,.bb__ghost{position:absolute;left:50%;bottom:2%;width:88%;aspect-ratio:1;transform-origin:50% 95%}.bb__bag{transform:translate(-50%) scale(var(--bb-scale, 1)) scaleX(1);transition:transform .55s cubic-bezier(.2,.7,.2,1)}.bb__bag.is-back{transform:translate(-50%) scale(var(--bb-scale, 1)) scaleX(-1)}.bb__bagimg{width:100%;height:100%;display:block;object-fit:contain;filter:drop-shadow(0 18px 18px rgba(46,36,30,.16))}.bb__ghost{transform:translate(-50%);opacity:0;transition:opacity .4s;pointer-events:none}.bb__ghost img{width:100%;height:100%;object-fit:contain;filter:grayscale(1) brightness(1.6) contrast(.6);opacity:.14}.bb__ghost span{position:absolute;right:2%;top:40%;font:500 10px/1 var(--ol-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--bb-mute)}.bb__stage.is-small .bb__ghost{opacity:1}.bb__layer{position:absolute;top:0;right:0;bottom:0;left:0}.bb__emb{position:absolute;transform:translate(-50%,-50%);transition:opacity .3s;mix-blend-mode:multiply}.bb__emb svg,.bb__hang svg,.bb__hang img{display:block;width:100%;height:auto}.bb__smiley{mix-blend-mode:normal;opacity:.94}.bb__ini{mix-blend-mode:normal;opacity:.95}.bb__ini--ghost{opacity:.28}.bb__flip.bb__emb{transform:translate(-50%,-50%) scaleX(var(--bb-flip, 1))}.bb__bag.is-back .bb__flip{--bb-flip: -1}.bb__hang{position:absolute;transform:translate(-50%) scaleX(var(--bb-flip, 1));transform-origin:50% 0;z-index:2;filter:drop-shadow(0 6px 5px rgba(46,36,30,.22))}.bb__hang>*{transform-origin:50% 2%;animation:bb-sway 5s ease-in-out infinite}.bb__hang.is-new>*{animation:bb-drop .9s cubic-bezier(.3,1.5,.5,1),bb-sway 5s .9s ease-in-out infinite}@keyframes bb-sway{0%,to{transform:rotate(var(--sw, 3deg))}50%{transform:rotate(calc(var(--sw, 3deg) * -1))}}@keyframes bb-drop{0%{transform:translateY(-14%) rotate(14deg);opacity:0}60%{opacity:1}to{transform:rotate(0)}}.bb__stage.is-resize .bb__bag{transition-duration:.6s}.bb__views{position:absolute;left:0;top:0;display:inline-flex;border:1px solid var(--bb-line);border-radius:999px;padding:3px;background:#f7f3eccc;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.bb__views button{border:0;background:none;padding:7px 14px;border-radius:999px;font-size:12.5px;cursor:pointer;min-height:32px}.bb__views button[aria-pressed=true]{background:var(--bb-ink);color:var(--bb-panel)}.bb__caption{margin:10px 0 0;text-align:center;font:500 10px/1.5 var(--ol-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--bb-mute);min-height:1.5em}.bb__steps{background:var(--bb-panel)}.bb__step{padding:24px var(--ol-gutter, 16px);border-bottom:1px solid var(--bb-line)}@container bb (min-width: 1080px){.bb__step{padding:28px 32px}}.bb__h{display:flex;align-items:baseline;gap:10px;margin:0 0 14px;font:500 12.5px/1 var(--ol-mono);letter-spacing:.1em;text-transform:uppercase}.bb__h span{color:var(--bb-mute)}.bb__h small{margin-left:auto;font:400 12.5px/1 var(--ol-sans);letter-spacing:0;text-transform:none;color:var(--bb-mute)}.bb__p{margin:-4px 0 14px;font-size:16px;line-height:1.5;color:var(--bb-mute)}.bb__label{margin:18px 0 10px;font:500 10px/1 var(--ol-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--bb-mute)}.bb button.is-on,.bb [aria-pressed=true],.bb [aria-checked=true]{outline:none}.bb__sizes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.bb__size{display:grid;gap:4px;text-align:left;padding:14px;border:1px solid var(--bb-line);background:transparent;cursor:pointer;border-radius:2px;transition:border-color .2s,background-color .2s}.bb__size b{font-weight:500;font-size:16px}.bb__size small{color:var(--bb-mute);font-size:12.5px}.bb__size span{margin-top:6px;font:400 20px/1 var(--ol-serif)}.bb__size.is-on{border-color:var(--bb-ink);box-shadow:inset 0 0 0 1px var(--bb-ink);background:#fff8}.bb__swatches{display:flex;flex-wrap:wrap;gap:6px 4px}.bb__sw{display:grid;justify-items:center;gap:6px;width:58px;min-width:0;padding:4px 0;border:0;background:none;cursor:pointer}.bb__sw i{width:34px;height:34px;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 1px #0000001f;outline:1.5px solid transparent;outline-offset:3px;transition:outline-color .2s}.bb__sw span{font-size:10px;color:var(--bb-mute)}.bb__sw.is-on i{outline-color:var(--bb-ink)}.bb__sw.is-on span{color:var(--bb-ink)}.bb__field{display:flex;align-items:center;gap:12px;border:1px solid var(--bb-ink);padding:0 14px;background:#fff6}.bb__field input{flex:1;min-width:0;height:58px;border:0;background:none;font:400 33px/1 var(--ol-serif);letter-spacing:.3em;text-transform:uppercase;color:var(--bb-ink);outline:none}.bb__field input::placeholder{color:#2e241e38}.bb__count{font-size:12.5px;color:var(--bb-mute);white-space:nowrap}.bb__err{margin:8px 0 0;font-size:12.5px;color:#a2352c}.bb__seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--bb-line);border-radius:2px}.bb__seg button{border:0;background:none;padding:11px 6px;font-size:12.5px;cursor:pointer;min-height:44px}.bb__seg button+button{border-left:1px solid var(--bb-line)}.bb__seg button.is-on{background:var(--bb-ink);color:var(--bb-panel)}.bb__charms{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.bb__charm{min-width:0;display:grid;justify-items:center;gap:4px;padding:12px 6px 10px;border:1px solid var(--bb-line);background:transparent;cursor:pointer;border-radius:2px;transition:border-color .2s,background-color .2s}.bb__charmart{display:grid;place-items:center;width:52px;height:62px}.bb__charmart svg,.bb__charmart img{width:100%;height:100%;object-fit:contain}.bb__charm b{font-weight:500;font-size:12.5px}.bb__charm small{font-size:10px;color:var(--bb-mute)}.bb__charm.is-on{border-color:var(--bb-ink);box-shadow:inset 0 0 0 1px var(--bb-ink);background:#fff8}.bb__charm:disabled{opacity:.45;cursor:not-allowed}.bb__letters{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}.bb__letters button{aspect-ratio:1;border:1px solid var(--bb-line);border-radius:50%;background:transparent;font-size:16px;cursor:pointer;min-width:0;padding:0;transition:background-color .15s,color .15s}.bb__letters .bb__none{grid-column:span 2;aspect-ratio:auto;border-radius:999px;font-size:12.5px}.bb__letters button.is-on{background:var(--bb-ink);color:var(--bb-panel);border-color:var(--bb-ink)}.bb__lprice{grid-column:1 / -1;font-size:12.5px;color:var(--bb-mute);margin-top:4px}.is-shake{animation:bb-shake .4s}@keyframes bb-shake{20%,60%{transform:translate(-4px)}40%,80%{transform:translate(4px)}}.bb__sum{padding:28px var(--ol-gutter, 16px) 120px;background:var(--bb-panel)}@container bb (min-width: 1080px){.bb__sum{padding:32px 28px}}.bb__sumtitle{margin:0 0 16px;font:400 26px/1.1 var(--ol-serif)}.bb__lines{list-style:none;margin:0;padding:0;border-top:1px solid var(--bb-line)}.bb__line{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--bb-line);font-size:16px}.bb__line div{display:grid;gap:3px;min-width:0}.bb__line b{font-weight:500}.bb__line small{color:var(--bb-mute);font-size:12.5px;line-height:1.45}.bb__line span{white-space:nowrap}.bb__oos{color:#a2352c!important}.bb__total{display:flex;justify-content:space-between;align-items:baseline;padding:18px 0}.bb__total span{font-size:16px;color:var(--bb-mute)}.bb__total b{font:400 33px/1 var(--ol-serif)}.bb__add{width:100%}.bb [data-bb-add][aria-busy=true]{opacity:.7;pointer-events:none}.bb [data-bb-add]:disabled{opacity:.5;cursor:not-allowed}.bb.is-added .bb__add{background:transparent;color:var(--bb-ink);box-shadow:inset 0 0 0 1px var(--bb-ink)}.bb__status{margin:12px 0 0;font-size:12.5px;line-height:1.45;color:var(--bb-mute)}.bb__status:empty{display:none}.bb__share+.bb__share{margin-top:8px}.bb__share{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;margin-top:12px;padding:0 16px;background:transparent;border:1px solid var(--bb-line);border-radius:2px;font-size:16px;cursor:pointer;transition:border-color .2s,background-color .2s}.bb__share:hover{border-color:var(--bb-ink);background:#fff6}.bb__share:focus-visible{outline:2px solid var(--bb-ink);outline-offset:2px}.bb__share svg{flex:none;color:var(--bb-mute)}@container bb (max-width: 1079.98px){.bb__stagewrap{position:sticky;top:var(--bb-top, var(--header-height, 56px));z-index:3;padding:8px var(--ol-gutter, 16px) 6px;border-bottom:1px solid var(--bb-line)}.bb__stage{width:min(100%,40svh)}.bb__caption{margin-top:4px;font-size:10px}.bb__views button{padding:6px 12px;font-size:12.5px}}.bb__bar{display:none}@media(max-width:1079.98px){.bb__bar{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px var(--ol-gutter, 16px) calc(10px + env(safe-area-inset-bottom));background:var(--bb-panel);border-top:1px solid var(--bb-line)}.bb__bar small{display:block;font-size:10px;color:var(--bb-mute)}.bb__bar b{font:400 20px/1 var(--ol-serif)}.bb__bar .ol-btn{flex:0 1 auto;min-height:48px;padding-inline:20px}.bb.is-added .bb__bar .ol-btn{background:transparent;color:var(--bb-ink);box-shadow:inset 0 0 0 1px var(--bb-ink)}}@media(prefers-reduced-motion:reduce){.bb__hang>*,.bb__hang.is-new>*{animation:none}.bb__bag{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/43/assets/ol-bag-builder.css.map */