.casame-size-explorer{--cs-paper: rgb(var(--color-background));--cs-accent: rgb(var(--color-primary));--cs-ink: rgb(var(--color-foreground));--cs-muted: rgba(var(--color-foreground), .72);--cs-line: rgba(var(--color-foreground), .2);--cs-ease: cubic-bezier(.2,.8,.2,1)}.casame-size-explorer *{box-sizing:border-box}.casame-size-explorer .editor{position:relative;max-width:900px;margin-inline:auto}.casame-size-explorer button,.casame-size-explorer input{font-family:var(--font-body-family)}.casame-size-explorer button{cursor:pointer;-webkit-tap-highlight-color:transparent}.casame-size-explorer button:focus-visible,.casame-size-explorer input:focus-visible,.casame-size-explorer .photo:focus-visible{outline:2px solid var(--cs-accent);outline-offset:5px}.casame-size-explorer .photo{position:relative;aspect-ratio:4 / 3;overflow:hidden;background:rgba(var(--color-foreground),.08);touch-action:pan-y;cursor:grab;-webkit-user-select:none;user-select:none}.casame-size-explorer .photo:active{cursor:grabbing}.casame-size-explorer .photo img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:50% 67%;display:block;pointer-events:none}.casame-size-explorer .photo .incoming{clip-path:inset(0 100% 0 0);z-index:2}.casame-size-explorer .caption{position:absolute;z-index:3;inset:16px 16px auto;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;pointer-events:none}.casame-size-explorer .caption-copy,.casame-size-explorer .counter{background:rgba(var(--color-background),.94);color:var(--cs-ink)}.casame-size-explorer .caption-copy{min-width:0;padding:12px 16px}.casame-size-explorer .size-name{margin:0 0 5px;color:rgb(var(--color-text-heading))}.casame-size-explorer .dimensions{margin:0;color:var(--cs-muted);font-family:var(--font-body-family);line-height:1.4}.casame-size-explorer .counter{margin:0;padding:9px 11px;white-space:nowrap;font-family:var(--font-body-family);font-variant-numeric:tabular-nums;line-height:1.4}.casame-size-explorer .counter b{font-weight:var(--font-body-weight);color:var(--cs-accent)}.casame-size-explorer .swipe-hint{position:absolute;z-index:3;bottom:16px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:8px;color:rgb(var(--color-button-text));background:rgba(var(--color-button),.9);border:1px solid rgba(var(--color-button-text),.2);border-radius:30px;padding:9px 13px;font-family:var(--font-body-family);font-weight:var(--font-body-weight);line-height:1.2;white-space:nowrap;pointer-events:none;transition:opacity .2s}.casame-size-explorer .swipe-hint svg{width:21px;height:11px}.casame-size-explorer .interacted .swipe-hint{opacity:0}.casame-size-explorer .selection{padding:20px 12px 0}.casame-size-explorer .track{position:relative;margin:0 10px;height:36px}.casame-size-explorer .track-line,.casame-size-explorer .track-fill{position:absolute;left:0;right:0;top:17px;height:1px;display:block!important;background:var(--cs-line)}.casame-size-explorer .track-fill{background:var(--cs-accent);transform-origin:left;transform:scaleX(var(--progress,0));transition:transform .35s var(--cs-ease)}.casame-size-explorer .ticks{display:flex;justify-content:space-between;position:absolute;top:0;right:0;bottom:0;left:0}.casame-size-explorer .ticks i{height:9px;width:1px;background:var(--cs-line);position:relative;top:13px}.casame-size-explorer .track input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:36px;margin:0;-webkit-appearance:none;appearance:none;background:transparent;cursor:grab;z-index:2}.casame-size-explorer .track input::-webkit-slider-runnable-track{height:1px;background:transparent}.casame-size-explorer .track input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:24px;height:24px;border-radius:50%;border:5px solid var(--cs-paper);background:var(--cs-accent);box-shadow:0 0 0 1px var(--cs-accent);margin-top:-12px}.casame-size-explorer .track input::-moz-range-track{height:1px;background:transparent}.casame-size-explorer .track input::-moz-range-thumb{width:15px;height:15px;border-radius:50%;background:var(--cs-accent);border:5px solid var(--cs-paper);box-shadow:0 0 0 1px var(--cs-accent)}.casame-size-explorer .size-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin:0 -8px}.casame-size-explorer .size-tabs button{position:relative;display:block;min-height:48px;padding:5px 0 11px;border:0;color:var(--cs-muted);background:transparent;font-family:var(--font-body-family);font-weight:var(--font-body-weight);font-size:13px;line-height:1.4;text-transform:none;letter-spacing:-.025em;white-space:nowrap;transition:color .2s}.casame-size-explorer .size-tabs button[aria-pressed=true]{color:var(--cs-accent)}.casame-size-explorer .size-tabs button[aria-pressed=true]:after{content:"";position:absolute;bottom:4px;left:calc(50% - 2px);width:4px;height:4px;border-radius:50%;background:var(--cs-accent)}.casame-size-explorer .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.casame-size-explorer .caption-copy.animate{animation:casame-size-caption-in .3s var(--cs-ease)}@keyframes casame-size-caption-in{0%{opacity:.2;transform:translateY(5px)}to{opacity:1;transform:none}}@media(min-width:768px){.casame-size-explorer .caption{inset:24px 24px auto}.casame-size-explorer .caption-copy{padding:16px 20px}.casame-size-explorer .size-tabs button{font-size:15px}}@media(max-width:350px){.casame-size-explorer .caption{inset:12px 12px auto;gap:8px}.casame-size-explorer .caption-copy{padding:10px 12px}.casame-size-explorer .size-tabs button{font-size:12px}}@media(prefers-reduced-motion:reduce){.casame-size-explorer *,.casame-size-explorer *:before,.casame-size-explorer *:after{animation:none!important;transition:none!important}}.casame-size-explorer .size-loading[hidden]{display:none}.casame-size-explorer .size-loading,.casame-size-explorer .interacted .size-loading{opacity:1;max-width:calc(100% - 32px);white-space:normal;text-align:center}
/*# sourceMappingURL=/cdn/shop/t/4/assets/casame-throw-size-explorer.css.map */
