.jb-colour-studio{--jb-studio-ink: var(--jb-blackberry, #1a1a1a);--jb-studio-cream: var(--jb-coconut, #faf3e6);--jb-studio-yellow: var(--jb-mango, #ffd664);--jb-studio-red: var(--jb-strawberry, #ff3b00);padding:72px 0;overflow:hidden;border-top:2px solid rgba(26,26,26,.08);color:var(--jb-studio-ink)}.jb-colour-studio *{box-sizing:border-box}.jb-colour-studio__inner{width:min(1280px,100%);margin:0 auto;padding:0 32px}.jb-colour-studio__header{margin:0 0 32px}.jb-colour-studio__heading{max-width:760px;margin:0;font-family:var(--font-display, inherit);font-size:clamp(24px,3vw,40px);font-weight:800;line-height:1.1;text-transform:uppercase}.jb-colour-studio__intro{max-width:620px;margin:10px 0 0;font-family:var(--font-body, inherit);font-size:15px;line-height:1.5;opacity:.7}.jb-colour-studio__layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(390px,.8fr);gap:16px;align-items:start}.jb-colour-studio__visual,.jb-colour-studio__controls{min-width:0;border:var(--bw-2, 2.5px) solid var(--jb-studio-ink);border-radius:var(--r-lg, 32px);background:#fff}.jb-colour-studio__visual{padding:16px;box-shadow:var(--sh-sticker, 4px 4px 0 var(--jb-studio-ink))}.jb-colour-studio__view-switcher{display:flex;width:fit-content;gap:4px;margin:0 0 14px auto;padding:4px;border:1.5px solid var(--jb-studio-ink);border-radius:999px;background:var(--jb-studio-cream)}.jb-colour-studio__view-button{min-height:38px;padding:8px 16px;border:0;border-radius:999px;background:transparent;color:var(--jb-studio-ink);cursor:pointer;font-family:var(--font-display, inherit);font-size:11px;font-weight:900;letter-spacing:.04em;text-transform:uppercase}.jb-colour-studio__view-button.is-active{background:var(--jb-studio-yellow)}.jb-colour-studio__view-button:focus-visible,.jb-colour-studio__piece-button:focus-visible,.jb-colour-studio__palette-button:focus-visible,.jb-colour-studio__action:focus-visible,.jb-colour-studio__stage-piece:focus-visible{outline:3px solid var(--jb-studio-red);outline-offset:3px}.jb-colour-studio__stage{position:relative;min-height:510px;overflow:hidden;border:1.5px solid rgba(26,26,26,.22);border-radius:var(--r-md, 20px);background:#fff}.jb-colour-studio__set-view{position:absolute;top:0;right:0;bottom:0;left:0}.jb-colour-studio__stage-piece{position:absolute;z-index:2;display:flex;align-items:center;justify-content:center;margin:0;padding:10px;border:2px solid transparent;border-radius:22px;background:transparent;color:var(--jb-studio-ink);cursor:pointer;transition:background .18s ease,border-color .18s ease,transform .18s ease}.jb-colour-studio__stage-piece:hover{transform:translateY(-3px)}.jb-colour-studio__stage-piece.is-active{border-color:transparent;background:transparent}.jb-colour-studio__stage-piece--table{top:12%;left:29%;z-index:1;width:42%;height:76%}.jb-colour-studio__stage-piece--chair1{top:12%;left:1%;width:36%;height:76%}.jb-colour-studio__stage-piece--chair2{top:12%;right:1%;width:36%;height:76%}.jb-colour-studio__stage-piece-image{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 10px 14px rgba(44,31,24,.14))}.jb-colour-studio__stage-label{position:absolute;bottom:8px;left:50%;min-width:max-content;padding:0;border:0;background:transparent;font-family:var(--font-display, inherit);font-size:9px;font-weight:900;letter-spacing:.045em;line-height:1;text-transform:uppercase;transform:translate(-50%)}.jb-colour-studio__detail-view{position:fixed;top:0;right:0;bottom:0;left:0;z-index:999999;display:none;place-items:center;padding:24px;overflow:auto;background:#1a1a1aeb}.jb-colour-studio__detail-view.is-open{display:grid}.jb-colour-studio__detail-dialog{position:relative;display:grid;width:min(1180px,calc(100vw - 48px));height:min(780px,calc(100dvh - 48px));min-height:480px;grid-template-rows:auto minmax(0,1fr);padding:32px 34px 28px;overflow:hidden;border:var(--bw-2, 2.5px) solid var(--jb-studio-ink);border-radius:var(--r-lg, 32px);background:#fff;box-shadow:0 20px 60px #00000047}.jb-colour-studio__detail-close{position:absolute;top:18px;right:18px;z-index:2;display:grid;width:44px;height:44px;place-items:center;padding:0 0 4px;border:var(--bw-2, 2.5px) solid var(--jb-studio-ink);border-radius:50%;background:var(--jb-studio-yellow);color:var(--jb-studio-ink);cursor:pointer;font-family:Arial,sans-serif;font-size:30px;line-height:1;box-shadow:var(--sh-sticker, 4px 4px 0 var(--jb-studio-ink));transition:transform .15s ease,box-shadow .15s ease,background .15s ease}.jb-colour-studio__detail-close:hover{background:var(--jb-studio-red);color:#fff;transform:translate(2px,2px);box-shadow:var(--sh-sticker-sm, 2px 2px 0 var(--jb-studio-ink))}.jb-colour-studio__detail-close:focus-visible{outline:3px solid var(--jb-studio-red);outline-offset:3px}.jb-colour-studio__detail-title{margin:0;padding:4px 64px 10px;font-family:var(--font-display, inherit);font-size:clamp(24px,3vw,38px);font-weight:800;line-height:1.1;text-align:center;text-transform:uppercase}.jb-colour-studio__detail-set{display:grid;width:100%;height:100%;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) minmax(0,1fr);gap:clamp(8px,1.5vw,20px);align-items:center}.jb-colour-studio__detail-piece{display:flex;min-width:0;width:100%;flex-direction:column;align-items:center}.jb-colour-studio__detail-piece--table{grid-column:2;grid-row:1}.jb-colour-studio__detail-piece--chair1{grid-column:1;grid-row:1}.jb-colour-studio__detail-piece--chair2{grid-column:3;grid-row:1}.jb-colour-studio__detail-image{width:100%;height:auto;object-fit:contain;filter:drop-shadow(0 12px 18px rgba(44,31,24,.14))}.jb-colour-studio__detail-label{min-width:0;margin-top:8px;padding:0;border:0;background:transparent;font-family:var(--font-display, inherit);font-size:11px;font-weight:900;letter-spacing:.03em;text-align:center;text-transform:uppercase}html.jb-colour-studio-modal-open{overflow:hidden}.jb-colour-studio__controls{padding:24px}.jb-colour-studio__control-heading{margin:0 0 14px;font-family:var(--font-display, inherit);font-size:15px;font-weight:800;line-height:1.15;text-transform:uppercase}.jb-colour-studio__pieces{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-bottom:24px}.jb-colour-studio__piece-button{position:relative;display:grid;min-width:0;min-height:102px;grid-template-rows:50px auto auto;justify-items:center;padding:8px 5px;border:1.5px solid rgba(26,26,26,.2);border-radius:14px;background:var(--jb-studio-cream);color:var(--jb-studio-ink);cursor:pointer;text-align:center}.jb-colour-studio__piece-button.is-active{border-color:var(--jb-studio-ink);background:#fff;box-shadow:0 0 0 1.5px var(--jb-studio-ink)}.jb-colour-studio__piece-thumb{display:block;width:62px;height:50px;object-fit:contain}.jb-colour-studio__piece-label{margin-top:3px;font-family:var(--font-display, inherit);font-size:9px;font-weight:900;letter-spacing:.04em;text-transform:uppercase}.jb-colour-studio__piece-colour{width:100%;margin-top:2px;overflow:hidden;font-size:9px;line-height:1.15;opacity:.62;text-overflow:ellipsis;white-space:nowrap}.jb-colour-studio__palette{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}.jb-colour-studio__palette-button{position:relative;display:grid;min-width:0;min-height:116px;grid-template-rows:60px minmax(18px,auto) 18px;align-items:center;justify-items:center;padding:7px 3px 6px;overflow:hidden;border:1.5px solid rgba(26,26,26,.18);border-radius:14px;background:var(--jb-studio-cream);color:var(--jb-studio-ink);cursor:pointer;box-shadow:inset 0 -4px 0 var(--jb-choice-colour, transparent)}.jb-colour-studio__palette-button:hover{border-color:#1a1a1a8c}.jb-colour-studio__palette-button.is-selected{border-color:var(--jb-studio-ink);background:#fff;box-shadow:inset 0 -4px 0 var(--jb-choice-colour, transparent),0 0 0 2px var(--jb-studio-ink)}.jb-colour-studio__palette-button.is-selected:after{position:absolute;top:5px;right:5px;display:grid;width:18px;height:18px;place-items:center;border:1.5px solid #fff;border-radius:50%;background:var(--jb-studio-ink);color:#fff;content:"\2713";font-size:10px;font-weight:900}.jb-colour-studio__palette-image{display:block;width:72px;max-width:100%;height:60px;object-fit:contain}.jb-colour-studio__palette-label{max-width:100%;overflow:hidden;font-family:var(--font-display, inherit);font-size:8px;font-weight:900;letter-spacing:.025em;line-height:1.05;text-align:center;text-overflow:ellipsis;text-transform:uppercase}.jb-colour-studio__availability{align-self:end;padding:3px 6px;border:1px solid rgba(26,26,26,.24);border-radius:999px;background:#f4f1eb;font-size:7px;font-weight:900;line-height:1;text-transform:uppercase}.jb-colour-studio__availability[hidden]{display:none}.jb-colour-studio__actions{margin-top:18px}.jb-colour-studio__action{min-height:50px;padding:12px 18px;border:var(--bw-2, 2.5px) solid var(--jb-studio-ink);border-radius:var(--r-pill, 999px);cursor:pointer;font-family:var(--font-display, inherit);font-size:13px;font-weight:800;letter-spacing:.035em;text-transform:uppercase}.jb-colour-studio__action--use{width:100%;background:var(--jb-studio-red);color:#fff;box-shadow:var(--sh-sticker, 4px 4px 0 var(--jb-studio-ink));transition:transform .15s ease,box-shadow .15s ease}.jb-colour-studio__action--use:not(:disabled):hover{transform:translate(2px,2px);box-shadow:var(--sh-sticker-sm, 2px 2px 0 var(--jb-studio-ink))}.jb-colour-studio__action--use:disabled{background:#ddd8cf;color:#1a1a1a8c;box-shadow:none;cursor:not-allowed;opacity:.7}.jb-colour-studio__status{min-height:18px;margin:11px 0 0;font-size:11px;line-height:1.4;text-align:center}.jb-colour-studio__note{margin:5px 0 0;font-size:10px;line-height:1.4;opacity:.52;text-align:center}@media(max-width:990px){.jb-colour-studio__layout{grid-template-columns:minmax(0,1fr) minmax(350px,.85fr);gap:18px}.jb-colour-studio__stage{min-height:440px}.jb-colour-studio__controls{padding:18px}}@media(max-width:780px){.jb-colour-studio{padding:48px 0}.jb-colour-studio__inner{width:100%;padding:0 16px}.jb-colour-studio__header{margin-bottom:24px}.jb-colour-studio__intro{font-size:14px}.jb-colour-studio__layout{grid-template-columns:1fr;gap:16px}.jb-colour-studio__visual,.jb-colour-studio__controls{border-radius:var(--r-lg, 32px)}.jb-colour-studio__visual{box-shadow:var(--sh-sticker, 4px 4px 0 var(--jb-studio-ink))}.jb-colour-studio__visual{padding:12px}.jb-colour-studio__stage{min-height:390px}.jb-colour-studio__controls{padding:18px 16px 20px}.jb-colour-studio__palette{display:flex;gap:8px;margin-right:-16px;margin-left:-16px;padding:2px 16px 10px;overflow-x:auto;scroll-padding-inline:16px;scroll-snap-type:x proximity;scrollbar-width:thin}.jb-colour-studio__palette-button{flex:0 0 96px;min-height:108px;grid-template-rows:58px minmax(18px,auto) 16px;scroll-snap-align:start}.jb-colour-studio__palette-image{width:84px;height:58px}.jb-colour-studio__palette-label{font-size:9px}}@media(max-width:430px){.jb-colour-studio__view-switcher{width:100%;margin-bottom:10px}.jb-colour-studio__view-button{flex:1}.jb-colour-studio__stage{min-height:300px}.jb-colour-studio__detail-view{padding:12px}.jb-colour-studio__detail-dialog{width:calc(100vw - 24px);height:min(520px,calc(100dvh - 24px));min-height:0;padding:18px 10px 14px;border-radius:var(--r-lg, 32px);box-shadow:0 18px 48px #0000004d}.jb-colour-studio__detail-title{padding:4px 46px 8px;font-size:20px}.jb-colour-studio__detail-close{top:12px;right:12px;width:42px;height:42px;font-size:28px}.jb-colour-studio__detail-set{grid-template-columns:minmax(0,1fr) minmax(0,1.45fr) minmax(0,1fr);gap:5px;overflow:hidden}.jb-colour-studio__detail-piece{width:100%}.jb-colour-studio__detail-label{max-width:102px;min-width:0;padding:6px 8px;overflow:hidden;font-size:8px;text-overflow:ellipsis;white-space:nowrap}.jb-colour-studio__stage-piece--table{top:10%;left:29%;width:42%;height:78%}.jb-colour-studio__stage-piece--chair1{top:10%;left:0;width:38%;height:78%}.jb-colour-studio__stage-piece--chair2{top:10%;right:0;width:38%;height:78%}.jb-colour-studio__stage-label{bottom:2px;font-size:7px}.jb-colour-studio__pieces{gap:5px}.jb-colour-studio__piece-button{min-height:94px;grid-template-rows:44px auto auto}.jb-colour-studio__piece-thumb{width:52px;height:44px}.jb-colour-studio__detail-label{max-width:88px;min-width:0;padding:5px 6px;overflow:hidden;font-size:7px;text-overflow:ellipsis;white-space:nowrap}}@media(prefers-reduced-motion:reduce){.jb-colour-studio__stage-piece,.jb-colour-studio__action--use,.jb-colour-studio__detail-close{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/57/assets/jb-confetti-colour-studio.css.map */