body{background:#F2F2F8}#usercentrics-root{display:none!important}.interactive-demos{padding:100px 0}.demos-container{max-width:1440px}.demos-header{text-align:center;font-size:40px;font-weight:600;margin-top:30px;margin-bottom:50px;flex-shrink:0}.demos-subtitle{text-align:center;font-size:18px;font-weight:500;color:#000;margin-top:-30px;margin-bottom:40px}.interactive-layout{display:flex;flex-wrap:nowrap;gap:30px;align-items:flex-start;justify-content:center;scroll-behavior:smooth}div[aria-label="Open in fullscreen mode"]{display:none!important}.sidebar{padding:12px;border-radius:14px;overflow-y:scroll;width:320px;flex-shrink:0;display:flex;flex-direction:column;max-height:500px}.section-heading{font-family:"Darker Grotesque";font-size:24px;font-style:normal;font-weight:600;line-height:70px;letter-spacing:-.48px;color:#000}.nav-list{display:flex;flex-direction:column;gap:12px;padding:6px 0}.topbar-title{font-family:'Onest',sans-serif;font-size:18px;font-style:normal;font-weight:500;line-height:normal;letter-spacing:-.32px;color:#000;text-align:center;margin-top:15px}.nav-item{display:flex;align-items:center;gap:12px;padding:12px;border-radius:12px;cursor:pointer;transition:.2s;background:#fff;border:1px solid #CDC5FF}.nav-item:hover{transform:translateX(2px);box-shadow:0 10px 20px rgb(0 0 0 / .06)}.nav-item.selected{background:#E8E5FF;box-shadow:0 10px 30px rgb(123 57 255 / .12);border:1px solid #4D30FF}.interactive-demos .thumb img{width:75px!important;height:45px!important;object-fit:cover!important;border-radius:12px!important;display:block!important;flex-shrink:0!important;max-width:75px!important}.title{font-size:16px;font-family:'Onest',sans-serif;font-style:normal;font-weight:300;line-height:normal;letter-spacing:-.32px}.preview-wrap{border-radius:10px;padding:0 14px 14px 14px;display:flex;flex-direction:column;flex:1;min-height:0}.preview{width:100%;flex:1;border-radius:10px;overflow:hidden;min-height:0}.interactive-layout iframe{width:100%;height:100%;border:0;aspect-ratio:16 / 9}.mobile-topbar{display:none;justify-content:center;align-items:center;padding:12px 18px;margin-bottom:20px;border-radius:12px}.chapter-dropdown{display:none;flex:1;margin:0 12px;padding:10px 12px;border-radius:10px;border:1px solid rgb(255 255 255 / .2);background:rgb(255 255 255 / .1);color:#000;font-size:14px;font-weight:500;cursor:pointer;transition:all 0.2s ease}.chapter-dropdown:focus{outline:none;border-color:var(--purple);background:rgb(255 255 255 / .2)}.chapter-dropdown option{background:#fff;color:var(--text);padding:8px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media (max-width:991px) and (orientation:portrait){.demos-container{padding:0 20px;max-width:991px}.demos-header{font-size:28px;margin-top:10px;margin-bottom:15px}.demos-subtitle{font-size:15px;margin-top:-4px;margin-bottom:20px}.interactive-demos{padding:60px 0 0 0}.interactive-layout{flex-direction:column;gap:0}.mobile-topbar{display:block;text-align:center}.custom-select-container{position:relative;order:1;width:calc(100vw - 40px);margin:12px 0;max-width:100%}.custom-select{position:relative}.custom-select-trigger{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-radius:10px;border:1px solid #e9e5ff;background:rgb(255 255 255 / .1);color:#000;font-size:14px;font-weight:500;cursor:pointer;transition:all 0.2s ease;box-sizing:border-box}.custom-select-trigger:hover{background:rgb(255 255 255 / .2)}.custom-select.open .custom-select-trigger{border-color:var(--purple);background:rgb(255 255 255 / .2);border-radius:10px 10px 0 0}.custom-select-arrow{transition:transform 0.2s ease;font-size:12px}.custom-select.open .custom-select-arrow{transform:rotate(180deg)}.custom-options{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #e9e5ff;border-top:none;border-radius:0 0 10px 10px;max-height:300px;overflow-y:auto;z-index:1000;display:none;box-shadow:0 4px 10px rgb(0 0 0 / .1)}.custom-select.open .custom-options{display:block}.custom-optgroup{padding:8px 0}.custom-optgroup-label{padding:4px 12px;font-size:12px;font-weight:600;color:#666;text-transform:uppercase;letter-spacing:.5px}.custom-option{padding:10px 12px;cursor:pointer;transition:background-color 0.2s ease;white-space:normal;word-wrap:break-word;max-width:100%;box-sizing:border-box}.custom-option:hover{background-color:#f5f5f5}.custom-option.selected{background-color:#e8e5ff;color:#4d30ff}.sidebar{display:none}.preview-wrap{padding:0;order:-1;width:100%}.bottom-sheet{position:fixed;left:0;right:0;bottom:0;background:rgb(255 255 255 / .98);border-radius:28px 28px 0 0;box-shadow:0 10px 35px rgb(15 28 58 / .35);padding:22px 22px 26px;display:flex;flex-direction:column;gap:16px;transform:translateY(110%);opacity:0;transition:transform 0.24s ease-out,opacity 0.24s ease-out;z-index:1000;pointer-events:none;max-height:70vh}.bottom-sheet.open{transform:translateY(0%);opacity:1;pointer-events:auto}.sheet-close-btn-div{text-align:right;display:block;position:absolute;right:3%;top:2%}.sheet-header{display:block;text-align:center}.sheet-title{font-size:20px;font-weight:700;letter-spacing:.01em}.close-btn{border:none;background:#fff0;font-size:28px;cursor:pointer;color:#7d8596;display:inline-block}.close-btn:hover{background:rgb(0 0 0 / .03)}.sheet-subtitle{font-size:14px;color:#9ca3b4}.chapters-list{margin-top:10px;max-height:360px;overflow-y:auto;padding-right:4px;display:flex;flex-direction:column;gap:8px}.chapters-list::-webkit-scrollbar{width:8px}.chapters-list::-webkit-scrollbar-track{background:rgb(240 240 245 / .5);border-radius:999px;margin:4px 0}.chapters-list::-webkit-scrollbar-thumb{background:rgb(136 144 163 / .8);border-radius:999px;border:1px solid rgb(240 240 245 / .5)}.chapters-list::-webkit-scrollbar-thumb:hover{background:rgb(104 112 131 / .9)}.optgroup{display:flex;flex-direction:column;gap:8px}.optgroup-label{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:#9ca3b4;margin:12px 0 4px 0;padding-left:12px}.chapter-item{width:100%;text-align:left;padding:12px 16px;border-radius:14px;border:1px solid rgb(210 219 234 / .9);background:#fff;box-shadow:0 4px 10px rgb(10 29 64 / .06);font-size:14px;font-weight:500;color:#222b3a;cursor:pointer;display:flex;align-items:center;justify-content:space-between;transition:transform 0.14s ease-out,box-shadow 0.14s ease-out,border-color 0.14s ease-out,background 0.14s ease-out}.chapter-item span{pointer-events:none}.chapter-item::after{content:"›";font-size:16px;color:#a3aec0}.chapter-item.active{background:#E8E5FF;box-shadow:0 10px 30px rgb(123 57 255 / .12);border:1px solid #4D30FF}.chapter-item:hover{border-color:#16c79a;box-shadow:0 8px 20px rgb(8 132 98 / .2)}.chapter-item:active{transform:scale(.97)}.bottom-handle{width:70px;height:4px;border-radius:999px;background:#d1d8e8;margin:2px auto 0}.tray-button{background:linear-gradient(90deg,#a855f7,#3b82f6);color:#fff;border:none;height:100%;padding:clamp(10px, 1.5vw, 15px) clamp(15px, 1.5vw, 20px);font-size:clamp(14px, 2vw, 18px);border-radius:clamp(7px, 1vw, 11px);font-family:"Darker Grotesque",sans-serif;font-weight:500;letter-spacing:.02em;text-transform:uppercase;min-width:200px;transition:all 0.3s ease-in-out;margin:15px auto}.tray-button:hover{background:linear-gradient(90deg,#a155f6,#4fbcff);filter:brightness(1.05);box-shadow:0 0 6px 1px rgb(161 85 246 / .4),0 0 6px 1px rgb(63 188 255 / .4)}.tray-button:active{transform:scale(.97);box-shadow:0 6px 20px rgb(227 108 77 / .45)}.bottom-sheet-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgb(0 0 0 / .5);z-index:999;backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:opacity 0.24s ease-out,visibility 0.24s ease-out;pointer-events:none}.bottom-sheet-overlay.active{opacity:1;visibility:visible;pointer-events:auto}body.bottom-sheet-open{overflow:hidden!important;height:100vh!important;width:100%!important}}@media (min-width:1024px){.tray-button{display:none}.bottom-sheet{display:none}}@media (min-width:768px) and (max-width:992px){.has-promo .sf-navbar-blur{height:20rem!important}}@media (max-width:767px) and (orientation:portrait){.demos-container{padding:0;max-width:767px}.demos-subtitle{padding:0 30px}}@media (orientation:landscape) and (max-width:767px){.sf-navbar-container{height:3.2rem!important}.sf-navbar-container .sf-navbar-logo{height:30px!important}.sf-navbar-blur{background-color:#fff;height:3.2rem!important}.sf-footer-logo{width:7.5rem!important}.sf-footer-content{padding:3rem 0 4rem}.sf-footer-title{font-size:16px!important}.sf-footer-nav{font-size:16px!important}.sf-footer-copy{font-size:16px!important;margin-top:20px!important}.sf-footer-address{font-size:1rem!important}.sf-footer-social{display:inline-block;padding:.5rem;font-size:2rem;line-height:1}.sf-footer-divider{margin:2rem 0}.sf-footer-text{font-size:16px!important}.sidebar{width:35%!important}.interactive-layout iframe{width:100%!important}}@media (orientation:landscape) and (min-width:667px) and (max-width:940px){.has-promo .sf-navbar-blur{height:20rem!important}.sf-navbar.-fixed.-visible .sf-navbar-container{background-color:#fff}.promo-bar .sf-container{padding:0!important;font-size:12px!important}.promo-bar .sf-container p img.close{width:10px!important;height:10px!important}.sf-navbar-container .sf-navbar-logo{width:120px!important}.sf-navbar-container .sf-navbar-toggle{width:24px!important}.sf-navbar-container .sf-navbar-toggle .sf-btn_menu{width:24px!important}html.has-promo .sf-navbar-blur{height:6.7rem!important}.has-promo .sf-navbar-logo,.has-promo .sf-navbar-toggle{top:3.5rem!important}.interactive-demos{padding:30px}.title{font-size:13px}.section-heading{font-size:22px;line-height:1.5}.demos-header{font-size:20px;margin-bottom:15px;margin-top:40px}.demos-subtitle{font-size:14px;margin-top:-6px;margin-bottom:20px}.nav-item{padding:6px}.nav-list{padding:6px 0}.interactive-layout{flex-direction:row;gap:30px;align-items:flex-start}.interactive-layout iframe{width:90%}.sidebar{display:flex;width:40%;flex-shrink:0;max-height:250px;order:0;overflow:scroll}.preview-wrap{padding:0 14px 14px 14px;order:0;width:auto}.mobile-topbar,.custom-select-container,.bottom-sheet,.bottom-sheet-overlay,.tray-button{display:none}}@media (min-width:941px) and (max-width:1199px) and (orientation:landscape){.interactive-demos{padding:50px 0}.demos-container{padding:0 8rem!important}.demos-header{font-size:30px;margin-top:25px;margin-bottom:25px}.section-heading{line-height:1.5}.interactive-layout{flex-direction:row;gap:30px;align-items:flex-start}.sidebar{display:flex;width:320px;flex-shrink:0;max-height:400px;order:0;overflow-y:scroll}.title{font-size:15px}.preview-wrap{padding:0 14px 14px 14px;order:0;width:auto}.mobile-topbar,.custom-select-container,.bottom-sheet,.bottom-sheet-overlay,.tray-button{display:none}}@media(min-width:992px){.sidebar{width:320px}.bottom-sheet{display:none}.preview-wrap{flex:1}}@media(min-width:1024px){.demos-container{padding:0 20px;max-width:1024px;margin:0 auto}.sidebar{width:30%;max-width:435px}.preview-wrap{width:70%}}@media(min-width:1280px){.demos-container{padding:0 20px;max-width:1280px;margin:0 auto}}@media(min-width:1440px){.demos-container{padding:0 20px;max-width:1440px;margin:0 auto}}@media(min-width:1530px){.demos-container{padding:0 50px;max-width:1530px;margin:0 auto}}