.toast{display:flex;align-items:flex-start;width:380px;max-width:100%;background:#222;border-radius:20px;box-shadow:0 4px 12px #00000026;position:relative;box-sizing:border-box;overflow:hidden;text-align:left}.toast__body{display:flex;flex:1;gap:12px;align-items:flex-start;min-width:0;padding:20px 20px 20px 16px}.toast--no-icon .toast__body{padding-left:20px}.toast__icon{flex-shrink:0;position:relative;width:24px;height:24px}.toast__icon-layer{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center}.toast__icon-layer--entering{animation:toast-icon-enter .36s cubic-bezier(.34,1.56,.64,1) both}.toast__icon-layer--leaving{animation:toast-icon-leave .13s cubic-bezier(.4,0,1,.6) both}.toast__icon-layer--leaving-loading{animation-duration:90ms}@keyframes toast-icon-enter{0%{opacity:0;transform:scale(.3)}to{opacity:1;transform:scale(1)}}@keyframes toast-icon-leave{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.6)}}.toast__content{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}.toast__title{font-weight:600;font-size:14px;line-height:1.35;color:#fff}.toast__description{font-weight:450;font-size:14px;line-height:1.35;color:#888;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.toast__action{display:inline-flex;align-self:flex-start;padding:0;border:none;background:transparent;font-family:inherit;font-weight:500;font-size:14px;line-height:1;color:#fff;cursor:pointer;transition:opacity .15s ease;height:20px;align-items:center}.toast__action:hover{opacity:.8}.toast__close-area{display:flex;align-items:flex-start;justify-content:flex-end;flex-shrink:0;padding:20px 16px 20px 0;align-self:stretch}.toast__close{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border:none;background:transparent;cursor:pointer;padding:0;color:#888;transition:opacity .15s ease}.toast__close:hover{opacity:.7}.toast-spinner{animation:toast-spin .8s linear infinite}@keyframes toast-spin{to{transform:rotate(360deg)}}.toast--mobile{width:min(380px,calc(100vw - 40px));max-width:calc(100vw - 40px);border-radius:999px;background:#222222c7;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.toast--mobile .toast__body{align-items:center;padding:12px 20px 12px 12px}.toast--mobile .toast__title{font-size:16px;font-weight:400}.toast--mobile .toast__icon,.toast--mobile .toast__icon svg{width:28px;height:28px}.toast--mobile .toast__close-area{align-items:center;padding:12px 12px 12px 0}.toast--mobile .toast__close{width:28px;height:28px}.toast--mobile .toast__close svg{width:24px;height:24px}.toast--mobile .toast__description,.toast--mobile .toast__action{display:none}.toast-portal{position:fixed;bottom:32px;left:32px;z-index:99999;width:380px;padding-top:64px;pointer-events:none;transition:padding-top .45s cubic-bezier(.22,1,.36,1)}.toast-portal--hovered{pointer-events:auto;padding-top:280px}.toast-portal__slot{position:absolute;left:0;right:0;bottom:0;pointer-events:auto;transform-origin:bottom center;transition:transform .5s cubic-bezier(.22,1,.36,1),opacity .5s cubic-bezier(.22,1,.36,1);will-change:transform,opacity}.toast-portal .toast{max-height:var(--slot-h, 9999px);transition:background-color .5s cubic-bezier(.22,1,.36,1),max-height .5s cubic-bezier(.22,1,.36,1)}.toast-portal__slot[data-stack-index="0"]{--slot-scale: 1;transform:translateY(0) scale(var(--slot-scale));opacity:1;z-index:3}.toast-portal__slot[data-stack-index="1"]{--slot-scale: .93;--back-cap: min( var(--frozen-max-h, 9999px), calc((var(--h-0, 80px) + 14px) / var(--slot-scale)) );transform:translateY(calc(min(var(--slot-h, 80px),var(--back-cap)) * var(--slot-scale) - var(--h-0, 80px) - 14px)) scale(var(--slot-scale));opacity:1;z-index:2}.toast-portal__slot[data-stack-index="1"] .toast{background:#2c2c2c;max-height:var(--back-cap)}.toast-portal__slot[data-stack-index="2"]{--slot-scale: .86;--back-cap: min( var(--frozen-max-h, 9999px), calc((var(--h-0, 80px) + 26px) / var(--slot-scale)) );transform:translateY(calc(min(var(--slot-h, 80px),var(--back-cap)) * var(--slot-scale) - var(--h-0, 80px) - 26px)) scale(var(--slot-scale));opacity:1;z-index:1}.toast-portal__slot[data-stack-index="2"] .toast{background:#383838;max-height:var(--back-cap)}.toast-portal--hovered .toast-portal__slot[data-stack-index="1"] .toast,.toast-portal--hovered .toast-portal__slot[data-stack-index="2"] .toast,.toast-portal:focus-within .toast-portal__slot[data-stack-index="1"] .toast,.toast-portal:focus-within .toast-portal__slot[data-stack-index="2"] .toast{background:#222}.toast-portal__slot[data-stack-index="3"],.toast-portal__slot[data-stack-index="-1"]{transform:translateY(-42px) scale(.8);opacity:0;pointer-events:none}.toast-portal--hovered .toast-portal__slot[data-stack-index="1"],.toast-portal:focus-within .toast-portal__slot[data-stack-index="1"]{--slot-scale: 1;transform:translateY(calc(-1 * (var(--h-0, 80px) + 8px))) scale(1)}.toast-portal--hovered .toast-portal__slot[data-stack-index="2"],.toast-portal:focus-within .toast-portal__slot[data-stack-index="2"]{--slot-scale: 1;transform:translateY(calc(-1 * (var(--h-0, 80px) + var(--h-1, 80px) + 16px))) scale(1)}.toast-portal--hovered .toast-portal__slot[data-stack-index="1"] .toast,.toast-portal--hovered .toast-portal__slot[data-stack-index="2"] .toast,.toast-portal:focus-within .toast-portal__slot[data-stack-index="1"] .toast,.toast-portal:focus-within .toast-portal__slot[data-stack-index="2"] .toast{max-height:var(--slot-h, 9999px);transition:background-color .5s cubic-bezier(.22,1,.36,1),max-height .3s cubic-bezier(.22,1,.36,1)}.toast-portal__slot.toast-portal__slot--entering{transform:translateY(110%) scale(.92);opacity:0;transition:none}.toast-portal__slot.toast-portal__slot--leaving[data-stack-index="0"],.toast-portal__slot.toast-portal__slot--evicted[data-stack-index="0"]{transform:translateY(calc(var(--slot-h, 80px) * -.2 - 10px)) scale(.8);opacity:0;pointer-events:none}.toast-portal__slot.toast-portal__slot--leaving[data-stack-index="1"],.toast-portal__slot.toast-portal__slot--evicted[data-stack-index="1"]{transform:translateY(calc(min(var(--slot-h, 80px),var(--back-cap)) * .8 - var(--h-0, 80px) - 24px)) scale(.8);opacity:0;pointer-events:none}.toast-portal__slot.toast-portal__slot--leaving[data-stack-index="2"],.toast-portal__slot.toast-portal__slot--evicted[data-stack-index="2"]{transform:translateY(calc(min(var(--slot-h, 80px),var(--back-cap)) * .8 - var(--h-0, 80px) - 36px)) scale(.8);opacity:0;pointer-events:none}@media (max-width: 675px){.toast-portal{left:20px;right:20px;width:auto;bottom:12px}.toast-portal .toast{width:100%;border-radius:999px;background:#222222c7;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.toast-portal .toast__body{align-items:center;padding:12px 20px 12px 12px}.toast-portal .toast--no-icon .toast__body{padding-left:20px}.toast-portal .toast__title{font-size:16px;font-weight:400}.toast-portal .toast__icon,.toast-portal .toast__icon svg{width:28px;height:28px}.toast-portal .toast__close-area{align-items:center;padding:12px 12px 12px 0}.toast-portal .toast__close{width:28px;height:28px}.toast-portal .toast__close svg{width:24px;height:24px}.toast-portal .toast__description,.toast-portal .toast__action{display:none}}.page{min-height:100vh;background:#f3f4f5;display:flex;justify-content:center;padding:80px 24px}.column{width:100%;max-width:720px;display:flex;flex-direction:column;gap:36px}.profile{display:flex;align-items:center;gap:10px}.avatar{width:40px;height:40px;border-radius:20px;overflow:hidden;flex-shrink:0;filter:drop-shadow(0 1px 4px rgba(0,0,0,.2))}.avatar img{width:40px;height:40px;object-fit:cover;display:block}.identity{display:flex;flex-direction:column;gap:2px}.name{font-weight:500;font-size:15px;color:#222;line-height:1.2}.role{font-weight:500;font-size:14px;color:#222c;line-height:1.2}.tabs{display:flex;gap:8px}.tab{transition:transform .16s var(--ease-out);height:32px;padding:0 12px;border-radius:18px;font-weight:500;font-size:13px;color:#222;background:#2222220d;line-height:1.5}.tab:hover{background:#2222221a}.tab:active{transform:scale(.97)}.tab-active,.tab-active:hover{background:#222;color:#fff}.content-wrap{position:relative}.content{display:flex;flex-direction:column;gap:36px;will-change:transform,opacity}.content-leaving{position:absolute;top:0;left:0;width:100%;pointer-events:none}.content-out-left{animation:content-out-left .28s var(--ease-out) both}.content-out-right{animation:content-out-right .28s var(--ease-out) both}@keyframes content-out-left{0%{opacity:1;transform:none}to{opacity:0;transform:translate(-14px)}}@keyframes content-out-right{0%{opacity:1;transform:none}to{opacity:0;transform:translate(14px)}}.content-in-right{animation:content-in-right .4s var(--ease-out) both}.content-in-left{animation:content-in-left .4s var(--ease-out) both}@keyframes content-in-right{0%{opacity:0;transform:translate(14px)}to{opacity:1;transform:none}}@keyframes content-in-left{0%{opacity:0;transform:translate(-14px)}to{opacity:1;transform:none}}@keyframes rise-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.first-load .profile,.first-load .tabs{animation:rise-in .55s var(--ease-out) both}.first-load .tabs{animation-delay:.08s}.first-load .content>.section>*{animation:rise-in .55s var(--ease-out) both}.first-load .content>.section:nth-child(1)>*:nth-child(1){animation-delay:.16s}.first-load .content>.section:nth-child(1)>*:nth-child(2){animation-delay:.22s}.first-load .content>.section:nth-child(1)>*:nth-child(3){animation-delay:.28s}.first-load .content>.section:nth-child(1)>*:nth-child(4){animation-delay:.34s}.first-load .content>.section:nth-child(2)>*:nth-child(1){animation-delay:.34s}.first-load .content>.section:nth-child(2)>*:nth-child(2){animation-delay:.4s}.first-load .content>.section:nth-child(2)>*:nth-child(3){animation-delay:.46s}.first-load .content>.section:nth-child(2)>*:nth-child(4){animation-delay:.52s}.section{display:flex;flex-direction:column;gap:24px}.section-title{margin:0;font-weight:500;font-size:15px;line-height:1.5;color:#222}.section-body{font-weight:450;font-size:15px;line-height:1.5;color:#222c}.link{color:#222;text-decoration:underline;text-underline-offset:2px}.contact{gap:36px}.contact-links{display:flex;flex-direction:column;align-items:flex-start;gap:8px}.contact-link{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 12px;margin:0 -12px;border-radius:18px;text-decoration:none;color:#222c;transition:background .15s ease}.contact-link:hover{background:#2222220d}.contact-icon{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;color:#222c}.contact-handle{font-weight:500;font-size:15px;line-height:1.5}.contact-location{font-weight:450;font-size:15px;line-height:1.5;color:#222c}.design-page{min-height:100vh;background:#f3f4f5;animation:page-in-right .45s var(--ease-out) both}@keyframes page-in-right{0%{opacity:0;transform:translate(28px)}to{opacity:1;transform:none}}@keyframes page-in-left{0%{opacity:0;transform:translate(-28px)}to{opacity:1;transform:none}}.design-page--exiting{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;overflow:hidden;pointer-events:none;animation:page-out-right .25s var(--ease-out) both}@keyframes page-out-right{0%{opacity:1;transform:none}to{opacity:0;transform:translate(24px)}}.home-in-left{animation:page-in-left .45s var(--ease-out) both}.home-exit{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;overflow:hidden;pointer-events:none;animation:page-out-left .25s var(--ease-out) both}@keyframes page-out-left{0%{opacity:1;transform:none}to{opacity:0;transform:translate(-24px)}}.design-page-layout{display:flex;align-items:flex-start;justify-content:center;gap:12px;padding:80px 0}.design-sidebar{flex:1;min-width:0;padding:0 24px;display:flex;flex-direction:column;gap:29px;position:sticky;top:80px}.sidebar-back-row{height:44px;display:flex;align-items:flex-start}.sidebar-back{transition:transform .16s var(--ease-out);display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 12px 0 8px;border-radius:18px;font-weight:500;font-size:15px;color:#222;transition:background .15s ease}.sidebar-back:hover{background:#2222220d}.sidebar-back:active{background:#2222221a;transform:scale(.97)}.design-groups{display:flex;flex-direction:column;gap:16px;padding-left:32px}.design-groups[hidden]{display:none}.design-group{display:flex;flex-direction:column;align-items:flex-start}.design-group-head{display:flex;align-items:center;gap:6px;height:36px;font-weight:500;font-size:14px;line-height:1.5;color:#222222a6;transition:color .15s ease}.design-group-head:hover{color:#000}.design-group-items{display:grid;grid-template-rows:0fr;width:100%;transition:grid-template-rows .2s var(--ease-out)}.design-group-items--open{grid-template-rows:1fr}.design-group-items-inner{overflow:hidden;min-height:0;display:flex;flex-direction:column;align-items:flex-start}.design-group-item{display:flex;align-items:center;height:36px;flex-shrink:0;font-weight:500;font-size:14px;line-height:1.5;color:#222222a6;opacity:0;transition:opacity .15s ease,color .15s ease}.design-group-items--open .design-group-item{opacity:1;transition-delay:calc(var(--i, 0) * 25ms)}.design-group-item:hover,.design-group-item--active{color:#000}.design-page-wrap{position:relative;width:720px;flex-shrink:0;padding-top:8px}.design-page-spacer{flex:1;min-width:0;padding:0 24px}.design-page-main{display:flex;flex-direction:column;gap:36px}.detail-in-up{animation:detail-in-up .4s var(--ease-out) both}.detail-in-down{animation:detail-in-down .4s var(--ease-out) both}.detail-leaving{position:absolute;top:8px;left:0;right:0;pointer-events:none}.detail-out-up{animation:detail-out-up .28s var(--ease-out) both}.detail-out-down{animation:detail-out-down .28s var(--ease-out) both}@keyframes detail-in-up{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}@keyframes detail-in-down{0%{opacity:0;transform:translateY(-24px)}to{opacity:1;transform:none}}@keyframes detail-out-up{0%{opacity:1;transform:none}to{opacity:0;transform:translateY(-24px)}}@keyframes detail-out-down{0%{opacity:1;transform:none}to{opacity:0;transform:translateY(24px)}}@media (max-width: 1140px){.design-sidebar,.design-page-spacer{display:none}.design-page-layout{padding:80px 24px}.design-page-wrap{width:100%;max-width:720px;margin:0 auto}}.modal-heading{display:flex;flex-direction:column;gap:2px}.detail-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.page-back{position:fixed;top:24px;left:24px;z-index:101;display:none;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;color:#222222b3;background:#2222220d;transition:background .15s ease,color .15s ease}.page-back:hover{background:#2222221a;color:#222}@media (max-width: 1140px){.page-back{display:inline-flex}}.modal-title{font-weight:500;font-size:15px;line-height:1.5;color:#222}.modal-year,.modal-desc{font-weight:450;font-size:15px;line-height:1.5;color:#222c}.modal-showcase{display:flex;justify-content:center;padding:40px 24px;background:#2222220d;border-radius:24px}.demo-controls{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.demo-pill{height:32px;padding:0 12px;border-radius:18px;font-weight:500;font-size:13px;color:#222;background:#f3f4f5;line-height:1.5;transition:background .15s ease,transform .16s var(--ease-out)}.demo-pill:hover{background:#fff}.demo-pill:active{transform:scale(.97)}.mobile-stage{position:relative;width:min(360px,100%);height:220px;border-radius:24px;overflow:hidden}.mobile-toast-wrap{position:absolute;left:12px;right:12px;bottom:12px;display:flex;justify-content:center;animation:mobile-toast-cycle 5.5s var(--ease-in-out) infinite}.mobile-toast-wrap .toast--mobile{width:100%;max-width:100%}@keyframes mobile-toast-cycle{0%{transform:translateY(140%);opacity:0}10%,74%{transform:none;opacity:1}86%,to{transform:translateY(-10px) scale(.92);opacity:0}}.modal-image{width:100%;border-radius:12px;display:block}.toast-stage{display:flex;flex-direction:column;align-items:center;gap:28px;width:100%;pointer-events:none;-webkit-user-select:none;user-select:none}.toast-slot{height:82px;display:flex;align-items:flex-start}.stack-demo{position:relative;width:380px;max-width:100%;height:290px;--h-0: 82px;--h-1: 82px}.stack-demo__slot{position:absolute;left:0;right:0;bottom:0;--slot-h: 82px;transform-origin:bottom center;transition:transform .5s cubic-bezier(.22,1,.36,1),opacity .5s cubic-bezier(.22,1,.36,1);will-change:transform,opacity}.stack-demo .toast{max-height:var(--slot-h);transition:background-color .5s cubic-bezier(.22,1,.36,1),max-height .5s cubic-bezier(.22,1,.36,1)}.stack-demo__slot[data-stack-index="0"]{transform:translateY(0) scale(1);z-index:3}.stack-demo__slot[data-stack-index="1"]{--slot-scale: .93;--back-cap: calc((var(--h-0) + 14px) / .93);transform:translateY(calc(min(var(--slot-h),var(--back-cap)) * var(--slot-scale) - var(--h-0) - 14px)) scale(var(--slot-scale));z-index:2}.stack-demo__slot[data-stack-index="1"] .toast{background:#2c2c2c;max-height:var(--back-cap)}.stack-demo__slot[data-stack-index="2"]{--slot-scale: .86;--back-cap: calc((var(--h-0) + 26px) / .86);transform:translateY(calc(min(var(--slot-h),var(--back-cap)) * var(--slot-scale) - var(--h-0) - 26px)) scale(var(--slot-scale));z-index:1}.stack-demo__slot[data-stack-index="2"] .toast{background:#383838;max-height:var(--back-cap)}.stack-demo--hovered .stack-demo__slot[data-stack-index="1"]{transform:translateY(calc(-1 * (var(--h-0) + 8px))) scale(1)}.stack-demo--hovered .stack-demo__slot[data-stack-index="2"]{transform:translateY(calc(-1 * (var(--h-0) + var(--h-1) + 16px))) scale(1)}.stack-demo--hovered .stack-demo__slot .toast{background:#222;max-height:var(--slot-h);transition:background-color .5s cubic-bezier(.22,1,.36,1),max-height .3s cubic-bezier(.22,1,.36,1)}.stack-demo__slot.stack-demo__slot--entering{transform:translateY(110%) scale(.92);opacity:0;transition:none}.stack-demo__slot.stack-demo__slot--leaving[data-stack-index="0"]{transform:translateY(calc(var(--slot-h) * -.2 - 10px)) scale(.8);opacity:0}.stack-demo__slot.stack-demo__slot--leaving[data-stack-index="1"]{transform:translateY(calc(min(var(--slot-h),var(--back-cap)) * .8 - var(--h-0) - 24px)) scale(.8);opacity:0}.stack-demo__slot.stack-demo__slot--leaving[data-stack-index="2"]{transform:translateY(calc(min(var(--slot-h),var(--back-cap)) * .8 - var(--h-0) - 36px)) scale(.8);opacity:0}.demo-cursor{position:absolute;left:0;top:0;z-index:10;opacity:0;transform:translate(360px,330px);transition:transform .9s cubic-bezier(.22,1,.36,1),opacity .35s ease;filter:drop-shadow(0 1px 2px rgba(0,0,0,.3))}.demo-cursor--center{opacity:1;transform:translate(180px,246px)}.demo-cursor--x{opacity:1;transform:translate(346px,234px)}.demo-cursor--click{transform:translate(346px,234px) scale(.8);transition:transform .12s ease,opacity .35s ease}.design-preview-live{display:flex;align-items:center;justify-content:center}.preview-toast{transform:scale(.66);pointer-events:none}.preview-stack{position:relative;margin-top:26px}.preview-stack .toast{position:relative;z-index:3}.preview-peek{position:absolute;left:0;right:0;margin:0 auto;height:44px;border-radius:20px}.preview-peek--1{top:-14px;width:93%;background:#2c2c2c;z-index:2}.preview-peek--2{top:-26px;width:86%;background:#383838;z-index:1}.designs{display:flex;flex-direction:column;gap:36px}.design-row{--bleed: max((100vw - 720px) / 2, 24px);--pad: 8px;--fade: 120px;--lead: 100px;--span: calc(var(--lead) + var(--fade));display:flex;flex-direction:column;gap:20px}.design-row-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.design-row-title{font-weight:500;font-size:15px;line-height:1.5;color:#222}.design-nav{display:flex;gap:2px}.nav-btn{width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;color:#222;transition:background .15s ease,opacity .15s ease}.nav-btn:hover:not(:disabled){background:#2222220f}.nav-btn:active:not(:disabled){background:#2222221f}.nav-btn:disabled{opacity:.3;cursor:default}.design-scroller{overflow-x:auto;overflow-y:hidden;margin:calc(-1 * var(--pad)) calc(-1 * var(--bleed));padding:var(--pad) var(--bleed);scroll-snap-type:x mandatory;scroll-padding-left:var(--bleed);scrollbar-width:none;-ms-overflow-style:none}.design-scroller.fade-right{--mask-fade-right: linear-gradient( to right, black calc(100% - var(--bleed) - var(--lead)), rgba(0, 0, 0, .95) calc(100% - var(--bleed) - var(--lead) + var(--span) * .2), rgba(0, 0, 0, .78) calc(100% - var(--bleed) - var(--lead) + var(--span) * .4), rgba(0, 0, 0, .5) calc(100% - var(--bleed) - var(--lead) + var(--span) * .6), rgba(0, 0, 0, .22) calc(100% - var(--bleed) - var(--lead) + var(--span) * .8), rgba(0, 0, 0, .07) calc(100% - var(--bleed) - var(--lead) + var(--span) * .92), transparent calc(100% - var(--bleed) + var(--fade)) );-webkit-mask-image:var(--mask-fade-right);mask-image:var(--mask-fade-right)}.design-scroller.fade-left{--mask-fade-left: linear-gradient( to right, transparent calc(var(--bleed) - var(--fade)), rgba(0, 0, 0, .07) calc(var(--bleed) + var(--lead) - var(--span) * .92), rgba(0, 0, 0, .22) calc(var(--bleed) + var(--lead) - var(--span) * .8), rgba(0, 0, 0, .5) calc(var(--bleed) + var(--lead) - var(--span) * .6), rgba(0, 0, 0, .78) calc(var(--bleed) + var(--lead) - var(--span) * .4), rgba(0, 0, 0, .95) calc(var(--bleed) + var(--lead) - var(--span) * .2), black calc(var(--bleed) + var(--lead)) );-webkit-mask-image:var(--mask-fade-left);mask-image:var(--mask-fade-left)}.design-scroller.fade-left.fade-right{--mask-fade-both: linear-gradient( to right, transparent calc(var(--bleed) - var(--fade)), rgba(0, 0, 0, .07) calc(var(--bleed) + var(--lead) - var(--span) * .92), rgba(0, 0, 0, .22) calc(var(--bleed) + var(--lead) - var(--span) * .8), rgba(0, 0, 0, .5) calc(var(--bleed) + var(--lead) - var(--span) * .6), rgba(0, 0, 0, .78) calc(var(--bleed) + var(--lead) - var(--span) * .4), rgba(0, 0, 0, .95) calc(var(--bleed) + var(--lead) - var(--span) * .2), black calc(var(--bleed) + var(--lead)), black calc(100% - var(--bleed) - var(--lead)), rgba(0, 0, 0, .95) calc(100% - var(--bleed) - var(--lead) + var(--span) * .2), rgba(0, 0, 0, .78) calc(100% - var(--bleed) - var(--lead) + var(--span) * .4), rgba(0, 0, 0, .5) calc(100% - var(--bleed) - var(--lead) + var(--span) * .6), rgba(0, 0, 0, .22) calc(100% - var(--bleed) - var(--lead) + var(--span) * .8), rgba(0, 0, 0, .07) calc(100% - var(--bleed) - var(--lead) + var(--span) * .92), transparent calc(100% - var(--bleed) + var(--fade)) );-webkit-mask-image:var(--mask-fade-both);mask-image:var(--mask-fade-both)}.design-scroller::-webkit-scrollbar{display:none}.design-track{display:flex;gap:20px;width:max-content}.design-card{margin:0;width:350px;display:flex;flex-direction:column;gap:16px;scroll-snap-align:start;cursor:pointer}.design-preview{width:350px;height:212px;border-radius:24px;overflow:hidden;background:#2222220d;transition:transform .2s var(--ease-out)}@media (hover: hover) and (pointer: fine){.design-card:hover .design-preview{transform:scale(1.02)}}.design-preview img{width:350px;height:212px;object-fit:cover;display:block}.design-meta{display:flex;flex-direction:column;gap:2px}.design-title{font-weight:500;font-size:15px;line-height:1.4;color:#222}.design-year{font-weight:450;font-size:15px;line-height:1.4;color:#2229}@media (max-width: 640px){.page{padding:48px 20px}.design-row{--bleed: 20px}}@keyframes reduced-fade-in{0%{opacity:0}to{opacity:1}}@keyframes reduced-fade-out{0%{opacity:1}to{opacity:0}}@media (prefers-reduced-motion: reduce){.content-in-right,.content-in-left,.home-in-left,.design-page,.detail-in-up,.detail-in-down,.first-load .profile,.first-load .tabs,.first-load .content>.section>*{animation-name:reduced-fade-in}.content-out-left,.content-out-right,.detail-out-up,.detail-out-down,.page-out-left,.page-out-right,.design-page--exiting,.home-exit{animation-name:reduced-fade-out}.design-card:hover .design-preview,.tab:active,.demo-pill:active,.sidebar-back:active{transform:none}}@font-face{font-family:InterVariable;src:url(/assets/InterVariable-DiVDrmQJ.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}:root{--ease-out: cubic-bezier(.23, 1, .32, 1);--ease-in-out: cubic-bezier(.77, 0, .175, 1)}*,*:before,*:after{box-sizing:border-box}html,body,#root{margin:0;padding:0;min-height:100%;background:#f3f4f5}html,body{overflow-x:clip}html{scrollbar-gutter:stable}body{font-family:InterVariable,Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#222;letter-spacing:-.01em}p{margin:0}button{font-family:inherit;border:none;background:none;padding:0;cursor:pointer;color:inherit}
