.hj-bb{--hj-bb-ink: rgb(var(--color-foreground, 255 255 255));--hj-bb-bg: rgb(var(--color-background, 8 8 8));--hj-bb-accent: rgb(var(--color-accent, 255 0 0));--hj-bb-muted: rgb(var(--color-foreground, 255 255 255) / .64);--hj-bb-label: rgb(var(--color-foreground, 255 255 255) / .56);--hj-bb-line: rgb(var(--color-foreground, 255 255 255) / .2);--hj-bb-ring: rgb(var(--color-foreground, 255 255 255) / .24);--hj-bb-fill: rgb(var(--color-accent, 255 0 0) / .12);--hj-bb-off: rgb(var(--color-foreground, 255 255 255) / .42);--hj-bb-danger: #ff5a5f;--hj-bb-sheet: #111111;--hj-bb-ease-out: cubic-bezier(.22, 1, .36, 1);--hj-bb-ease-in: cubic-bezier(.4, 0, 1, 1);display:flex;flex-direction:column;gap:24px;min-width:0;container-type:inline-size;color:var(--hj-bb-ink)}html.hj-bb-lock,html.hj-bb-lock body{overflow:hidden}.hj-bb__sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.hj-bb__opt{display:flex;flex-direction:column;gap:12px;min-width:0}.hj-bb__opt[hidden]{display:none}.hj-bb__head{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:20px}.hj-bb__label{font-size:12px;font-weight:700;letter-spacing:.18em;line-height:1.2;color:var(--hj-bb-label)}.hj-bb__value{font-size:12px;font-weight:600;line-height:1.3;text-align:right}.hj-bb__row{display:flex;gap:14px;overflow-x:auto;padding:6px 6px 4px;margin:0 -6px;scrollbar-width:none;scroll-snap-type:x proximity;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}.hj-bb__row::-webkit-scrollbar{display:none}.hj-bb__sw{position:relative;flex:0 0 88px;width:88px;display:flex;flex-direction:column;align-items:center;gap:9px;margin:0;cursor:pointer;scroll-snap-align:start;text-align:center;transition:opacity .18s ease;-webkit-tap-highlight-color:transparent}.hj-bb__sw input{position:absolute;top:0;left:50%;width:76px;height:76px;margin:0 0 0 -38px;padding:0;opacity:0;cursor:pointer;-webkit-appearance:none;appearance:none}.hj-bb__circle{position:relative;display:block;width:76px;height:76px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px var(--hj-bb-ring);transition:box-shadow .18s ease,transform .16s ease}.hj-bb__clip{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:999px;overflow:hidden;display:flex;align-items:center;justify-content:center}.hj-bb__clip img{display:block;width:100%;height:100%;max-width:none;object-fit:cover}.hj-bb__clip--fit img{width:80%;height:80%;object-fit:contain}.hj-bb__clip--none:after{content:"";position:absolute;left:50%;top:-12%;width:3px;height:124%;background:var(--hj-bb-accent);transform:translate(-50%) rotate(45deg)}.hj-bb__badge{position:absolute;right:-6px;bottom:-2px;padding:3px 6px;border-radius:999px;background:var(--hj-bb-bg);border:1px solid var(--hj-bb-off);color:var(--hj-bb-ink);font-size:10px;font-weight:800;letter-spacing:.04em;line-height:1.1}.hj-bb__text{display:block}.hj-bb__name{display:block;font-size:12px;font-weight:800;letter-spacing:.06em;line-height:1.2;color:var(--hj-bb-muted);transition:color .16s ease}.hj-bb__sub{display:block;margin-top:2px;font-size:11px;font-weight:600;line-height:1.25;color:var(--hj-bb-label);transition:color .16s ease}.hj-bb__flag{display:none;font-size:10px;font-weight:700;letter-spacing:.06em;line-height:1.2;color:var(--hj-bb-danger)}.hj-bb__sw input:checked+.hj-bb__circle{box-shadow:0 0 0 3px var(--hj-bb-bg),0 0 0 5px var(--hj-bb-accent)}.hj-bb__sw input:checked~.hj-bb__text .hj-bb__name,.hj-bb__sw input:checked~.hj-bb__text .hj-bb__sub{color:var(--hj-bb-ink)}.hj-bb__sw input:focus-visible+.hj-bb__circle{box-shadow:0 0 0 3px var(--hj-bb-bg),0 0 0 5px var(--hj-bb-ink)}.hj-bb__sw input:checked:focus-visible+.hj-bb__circle{box-shadow:0 0 0 3px var(--hj-bb-bg),0 0 0 5px var(--hj-bb-accent),0 0 0 7px var(--hj-bb-ink)}.hj-bb__sw:active .hj-bb__circle{transform:scale(.96)}.hj-bb__sw.is-faded{opacity:.35}.hj-bb__sw.is-soldout{opacity:.55}.hj-bb__sw.is-soldout .hj-bb__flag{display:block}.hj-bb__chips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.hj-bb__chip{position:relative;display:block;margin:0;cursor:pointer;transition:opacity .18s ease;-webkit-tap-highlight-color:transparent}.hj-bb__chip input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;padding:0;opacity:0;cursor:pointer;-webkit-appearance:none;appearance:none}.hj-bb__chip-box{position:relative;display:flex;align-items:center;justify-content:center;min-height:48px;padding:10px 8px;border-radius:6px;border:1.5px solid var(--hj-bb-line);overflow:hidden;font-size:13px;font-weight:800;letter-spacing:.08em;line-height:1.2;text-align:center;transition:border-color .16s ease,background-color .16s ease,color .16s ease}.hj-bb__chip input:checked+.hj-bb__chip-box{border-color:var(--hj-bb-accent);background:var(--hj-bb-fill)}.hj-bb__chip input:focus-visible+.hj-bb__chip-box{outline:2px solid var(--hj-bb-ink);outline-offset:2px}.hj-bb__chip.is-soldout .hj-bb__chip-box{color:var(--hj-bb-off)}.hj-bb__chip.is-soldout .hj-bb__chip-box:after{content:"";position:absolute;left:-4%;right:-4%;top:50%;height:1px;background:var(--hj-bb-off);transform:rotate(-9deg)}.hj-bb__chip.is-faded{opacity:.35}.hj-bb__hint{margin:0;font-size:13px;line-height:1.4;color:var(--hj-bb-muted)}.hj-bb__link{display:inline-flex;align-items:center;gap:6px;min-height:44px;margin:-12px 0;padding:0;background:none;border:0;color:var(--hj-bb-ink);font:inherit;font-size:13px;font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer}.hj-bb__link:focus-visible{outline:2px solid var(--hj-bb-ink);outline-offset:2px;border-radius:2px}.hj-bb__low{margin:-8px 0 0;font-size:13px;font-weight:700;line-height:1.3;color:var(--hj-bb-danger)}.hj-bb__low[hidden]{display:none}.hj-bb__dialog{border:0;padding:0;margin:0;background:transparent;color:var(--hj-bb-ink);font:inherit;max-width:none;max-height:none;overflow:visible}.hj-bb__dialog::backdrop{background:#0000009e;opacity:0;transition:opacity .24s ease}.hj-bb__dialog.is-open::backdrop{opacity:1}.hj-bb__panel{display:flex;flex-direction:column;gap:16px;max-height:inherit;overflow-y:auto;overscroll-behavior:contain;background:var(--hj-bb-sheet);border:1px solid rgb(var(--color-foreground, 255 255 255) / .12);padding:10px 20px 24px}.hj-bb__dialog.is-sheet{position:fixed;inset:auto 0 0 0;width:100%;max-height:92dvh;transform:translateY(104%);transition:transform .24s var(--hj-bb-ease-in)}.hj-bb__dialog.is-sheet.is-open{transform:translateY(0);transition:transform .34s var(--hj-bb-ease-out)}.hj-bb__dialog.is-sheet .hj-bb__panel{border-radius:18px 18px 0 0;border-bottom:0;padding-bottom:calc(24px + env(safe-area-inset-bottom,0px))}.hj-bb__dialog.is-modal{position:fixed;top:0;right:0;bottom:0;left:0;margin:auto;width:min(520px,calc(100% - 32px));height:fit-content;max-height:min(92dvh,900px);opacity:0;transform:translateY(12px) scale(.97);transition:opacity .2s ease,transform .24s var(--hj-bb-ease-in)}.hj-bb__dialog.is-modal.is-open{opacity:1;transform:none;transition:opacity .24s ease,transform .34s var(--hj-bb-ease-out)}.hj-bb__dialog.is-modal .hj-bb__panel{border-radius:16px}.hj-bb__grip{align-self:center;width:40px;height:4px;border-radius:999px;background:rgb(var(--color-foreground, 255 255 255) / .24);margin-top:2px}.hj-bb__dialog.is-modal .hj-bb__grip{display:none}.hj-bb__bar{display:flex;justify-content:space-between;align-items:center;gap:12px}.hj-bb__dialog-title{margin:0;font-size:18px;font-weight:900;line-height:1.2;letter-spacing:.02em;color:var(--hj-bb-ink)}.hj-bb__close{flex:0 0 auto;width:44px;height:44px;padding:0;border-radius:999px;background:rgb(var(--color-foreground, 255 255 255) / .08);border:1px solid rgb(var(--color-foreground, 255 255 255) / .14);color:var(--hj-bb-ink);display:flex;align-items:center;justify-content:center;cursor:pointer}.hj-bb__close:focus-visible{outline:2px solid var(--hj-bb-ink);outline-offset:2px}.hj-bb__chart{border-radius:10px;overflow:hidden;background:#fff;aspect-ratio:var(--hj-bb-chart-ratio, 1)}.hj-bb__chart img{display:block;width:100%;height:100%;object-fit:contain}@container (min-width: 440px){.hj-bb__row{flex-wrap:wrap;gap:8px 6px;overflow:visible;scroll-snap-type:none}}@media(hover:hover){.hj-bb__sw:hover input:not(:checked)+.hj-bb__circle{box-shadow:0 0 0 3px var(--hj-bb-bg),0 0 0 5px rgb(var(--color-accent, 255 0 0) / .5)}.hj-bb__chip:hover input:not(:checked)+.hj-bb__chip-box{border-color:rgb(var(--color-foreground, 255 255 255) / .36)}}@media(prefers-reduced-motion:reduce){.hj-bb *,.hj-bb__dialog,.hj-bb__dialog::backdrop{transition-duration:.01ms!important}}
/*# sourceMappingURL=/cdn/shop/t/124/assets/hj-belt-builder.css.map */