.planner-mode-showcase{--pms-accent: #e8872a;--pms-title: #ffffff;--pms-body: #9b9b9b;--pms-content-max-width: 1360px;width:100%;color:var(--pms-title)}.planner-mode-showcase.page-width,.planner-mode-showcase.w100{margin-inline:auto}.planner-mode-showcase.w100{max-width:var(--pms-content-max-width);padding-inline:20px}.planner-mode-showcase__inner{display:grid;grid-template-columns:1fr;gap:3.2rem;align-items:center}.planner-mode-showcase__device{position:relative;min-width:0;aspect-ratio:1940 / 1067}.planner-mode-showcase__frame{position:relative;z-index:1;display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none}.planner-mode-showcase__board{position:absolute;z-index:2;top:25.58%;left:6.96%;width:84.48%;height:47.04%;display:block;border-radius:1.5%;background:#101010;image-rendering:pixelated;image-rendering:crisp-edges}.planner-mode-showcase__image{position:absolute;z-index:3;top:25.58%;left:6.96%;width:84.48%;height:47.04%;overflow:hidden;border-radius:1.5%;opacity:0;pointer-events:none;transition:opacity .45s ease}.planner-mode-showcase__image.is-active:has(img){opacity:1}.planner-mode-showcase__image img{display:block;width:100%;height:100%;object-fit:cover}.planner-mode-showcase__content{min-width:0;max-width:48rem}.planner-mode-showcase__tag{margin:0 0 1.2rem;font-size:var(--lp-type-eyebrow-size);line-height:var(--lp-type-eyebrow-lh);letter-spacing:var(--lp-type-eyebrow-ls);font-weight:600;text-transform:uppercase;color:var(--pms-accent)}.planner-mode-showcase__title{margin:0;font-size:var(--lp-type-section-title-size);line-height:var(--lp-type-section-title-lh);letter-spacing:var(--lp-type-section-title-ls);font-weight:700;color:var(--pms-title)}.planner-mode-showcase__body{margin:1.2rem 0 0;font-size:var(--lp-type-section-subtitle-size);line-height:var(--lp-type-section-subtitle-lh);color:var(--pms-body)}.planner-mode-showcase__body p{margin:0}.planner-mode-showcase__controls{margin-top:3rem;padding:1.6rem 1.6rem 1.8rem;border:1px solid rgba(255,255,255,.11);border-radius:2rem;background:#07090b}.planner-mode-showcase__tabs{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:.6rem}.planner-mode-showcase__tab{min-width:0;min-height:3.4rem;padding:0 .8rem;border:1px solid rgba(255,255,255,.07);border-radius:999px;background:#080a0c;color:#777c84;font-size:var(--lp-type-badge-size);line-height:var(--lp-type-badge-lh);font-weight:500;white-space:nowrap;cursor:pointer;transition:border-color .2s ease,background .2s ease,color .2s ease,transform .2s ease}.planner-mode-showcase__tab:hover,.planner-mode-showcase__tab:focus-visible,.planner-mode-showcase__tab.is-active{outline:none;border-color:color-mix(in srgb,var(--pms-accent) 40%,transparent);background:color-mix(in srgb,var(--pms-accent) 7%,transparent);color:var(--pms-accent)}.planner-mode-showcase__tab.is-active{transform:translateY(-1px)}.planner-mode-showcase__knob-stage{position:relative;display:grid;min-height:20.6rem;place-items:center}.planner-mode-showcase__knob-base{position:absolute;width:17.2rem;aspect-ratio:1;border:1px solid rgba(255,255,255,.07);border-radius:50%;background:#0b0d0f;box-shadow:inset 0 0 0 1.4rem #080a0c,0 20px 40px #00000059}.planner-mode-showcase__knob{position:relative;z-index:2;display:grid;width:17.2rem;aspect-ratio:1;place-items:center;border-radius:50%;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}.planner-mode-showcase__knob:active,.planner-mode-showcase__knob.is-dragging{cursor:grabbing}.planner-mode-showcase__knob-disc{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;width:68%;height:68%;margin:auto;object-fit:contain;pointer-events:none}.planner-mode-showcase__knob-rotor{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;width:68%;height:68%;margin:auto;transform:rotate(calc(var(--pms-knob-angle, -58deg) + 58deg));transition:transform .52s cubic-bezier(.22,1,.36,1);will-change:transform;pointer-events:none}.planner-mode-showcase__knob.is-dragging .planner-mode-showcase__knob-rotor,.planner-mode-showcase.is-touring .planner-mode-showcase__knob-rotor{transition:none}.planner-mode-showcase.is-touring [data-pms-knob],.planner-mode-showcase.is-touring [data-pms-tab]{pointer-events:none}.planner-mode-showcase__knob-pointer{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;pointer-events:none}.planner-mode-showcase__hint,.planner-mode-showcase__note{margin:1.2rem 0 0;font-size:var(--lp-type-badge-size);line-height:var(--lp-type-badge-lh);color:var(--pms-body)}.planner-mode-showcase__note{opacity:.8}.planner-mode-showcase__device,.planner-mode-showcase [data-pms-copy-item],.planner-mode-showcase__controls{will-change:transform,opacity}@media screen and (max-width:989px){.planner-mode-showcase__content{display:contents}.planner-mode-showcase__copy{order:1;max-width:none}.planner-mode-showcase__device{order:2}.planner-mode-showcase__controls{order:3;margin-top:0}.planner-mode-showcase__hint{order:4}.planner-mode-showcase__note{order:5}.planner-mode-showcase__inner{gap:2rem}.planner-mode-showcase__tabs{grid-template-columns:repeat(3,minmax(0,1fr))}.planner-mode-showcase__tab{min-height:3.8rem;padding:0 .6rem;overflow:hidden;text-overflow:ellipsis}}@media screen and (min-width:990px){.planner-mode-showcase__inner{grid-template-columns:minmax(0,1.2fr) minmax(32rem,.8fr);gap:6.4rem}}@media(prefers-reduced-motion:reduce){.planner-mode-showcase__knob-rotor,.planner-mode-showcase__image{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/124/assets/planner-mode-showcase.css.map */