.controller-page{--pad-color:#d8fbfa;background:#fff radial-gradient(circle at 50% 0,#d8fbfa,#0000 max(240px,25vw));min-height:100vh;padding:0 32px 100px}.controller-hero{background:0 0;margin-inline:-32px;padding-bottom:clamp(24px,3vw,40px)}.controller-intro{width:min(var(--content-max),100%);text-align:left;background:linear-gradient(125deg,#f5f5f1,#f0f3f0 60%,#e6eeea);border-radius:36px;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center;gap:36px;margin:0 auto;padding:28px 48px;display:grid;overflow:hidden}.controller-intro-copy{z-index:3;min-width:0;margin-block:16px;position:relative}.controller-intro-mark{border-radius:25%;width:10cqw;max-width:32px;height:auto;display:block;position:absolute;bottom:2.5cqw;right:2.5cqw}.controller-intro-copy.download-copy.clipboard-product-copy>p{margin-bottom:28px}.controller-downloads{position:relative}.controller-desktop-slot{grid-column:1/-1;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:12px;height:32px;transition:height .38s cubic-bezier(.22,1,.36,1);display:grid}.controller-desktop-slot[data-expanded=false]{position:absolute;inset:calc(100% + 12px) 0 auto}.controller-desktop-slot[data-expanded=true]{height:76px}.controller-desktop-toggle{color:#626a68;text-underline-offset:3px;cursor:pointer;background:0 0;border:0;grid-column:1/-1;justify-self:center;min-height:32px;padding:4px 10px;font-size:12px;font-weight:600;text-decoration:underline}.controller-desktop-entry{animation:.38s cubic-bezier(.22,1,.36,1) backwards controller-desktop-reveal}.controller-desktop-entry:nth-child(2){animation-delay:70ms}@keyframes controller-desktop-reveal{0%{opacity:0;translate:0 10px;scale:.98}to{opacity:1;translate:0;scale:1}}.controller-desktop-toggle:hover{color:#121719}.controller-desktop-toggle:focus-visible{outline-offset:2px;border-radius:6px;outline:2px solid #476149}.clipboard-download-icon svg{width:23px;height:23px}.controller-intro-visual{align-self:stretch;min-width:0;display:flex;position:relative}.touchpad-demo{isolation:isolate;align-items:center;width:100%;display:flex;position:relative}.touchpad-demo-stage{aspect-ratio:1.75;width:100%;position:relative}.touchpad-display{z-index:1;aspect-ratio:1.7;width:80%;position:absolute;top:2%;left:0;container-type:inline-size}.touchpad-desktop-viewport{border-radius:14px;position:absolute;inset:0;overflow:hidden;box-shadow:0 0 0 1px #18181b08,0 18px 36px -18px #24242a20}.touchpad-desktop-track{width:200%;height:100%;display:flex;transform:translate(0,0)}.touchpad-desktop-space{background:radial-gradient(at 15% 100%,#adbcc5,#0000 70%),linear-gradient(135deg,#e4e8ec,#d5dfe6);flex:0 0 50%;height:100%;position:relative}.touchpad-desktop-space-next{background:radial-gradient(at 90% 100%,#c3b6cf,#0000 70%),linear-gradient(135deg,#ede8f1,#ddd8e7)}.touchpad-desktop-dock{opacity:0;background:#fff5;border:1px solid #fff7;border-radius:6px;gap:5px;padding:4px 6px;display:flex;position:absolute;bottom:3%;left:50%;transform:translate(-50%,5px)}.touchpad-window{background:#fff;border:1px solid #fff;border-radius:14px;position:absolute;inset:0;overflow:hidden;transform:scale(1);box-shadow:0 0 0 1px #18181b08,0 18px 36px -18px #24242a20}.touchpad-window-bar{background:#fafafb;border-bottom:1px solid #ededf0;align-items:center;gap:5px;height:11%;padding-inline:12px;display:flex}.touchpad-window-bar>i{background:#d4d4d9;border-radius:50%;width:5px;height:5px}.touchpad-window-bar>span{background:#dfdfe4;border-radius:4px;width:22%;height:3px;margin-inline:auto}.touchpad-window-body{height:89%;display:flex}.touchpad-window-sidebar{background:#fafafb;border-right:1px solid #ededf0;flex-direction:column;gap:12px;width:18%;padding:18px 12px;display:flex}.touchpad-window-sidebar>b{background:#dcdde2;border-radius:5px;width:16px;height:16px;margin-bottom:5px}.touchpad-window-sidebar>i{background:#dddde2;border-radius:2px;height:3px}.touchpad-window-sidebar>i:nth-child(3){background:#a4a7b1}.touchpad-window-viewport{flex:1;min-width:0;padding:18px;overflow:hidden}.touchpad-document-heading{flex-direction:column;gap:5px;margin-bottom:14px;display:flex}.touchpad-document-heading>b{background:#8f939d;border-radius:3px;width:42%;height:5px}.touchpad-document-heading>i{background:#e1e2e7;border-radius:3px;width:62%;height:3px}.touchpad-desktop-gallery{grid-template-columns:repeat(2,1fr);gap:16px 12px;display:grid}.touchpad-gallery-item>span{aspect-ratio:1.5;background:linear-gradient(135deg,#f0f1f4,#e5e7ec);border-radius:6px;display:block;position:relative;overflow:hidden}.touchpad-gallery-item>span:before{content:"";background:linear-gradient(150deg,#dce0e8,#f5f6f8);border-radius:50%;width:74%;height:115%;position:absolute;top:18%;left:-12%;transform:rotate(-35deg)}.touchpad-gallery-item>span:after{content:"";background:linear-gradient(140deg,#f7f8fa,#d4d9e3);border-radius:50%;width:66%;height:120%;position:absolute;top:30%;right:-12%;transform:rotate(35deg)}.gallery-1>span{background:linear-gradient(135deg,#eceff6,#d7deea)}.gallery-1>span:before{background:linear-gradient(150deg,#bcc9df,#e8edf6)}.gallery-1>span:after{background:linear-gradient(140deg,#e8eef8,#b6c5dc)}.touchpad-gallery-item>i,.touchpad-gallery-item>b{background:#d4d6dc;border-radius:2px;width:60%;height:3px;margin-top:5px;display:block}.touchpad-gallery-item>b{background:#ededf0;width:40%}.touchpad-cursor{z-index:2;filter:drop-shadow(0 2px 2px #0003);width:18px;height:22px;transition:left .45s cubic-bezier(.22,1,.36,1);animation:4.6s cubic-bezier(.4,0,.2,1) both touchpad-cursor-move;position:absolute;top:32%;left:24%}.touchpad-demo-phone{z-index:2;width:52%;position:absolute;bottom:11%;right:2%}.touchpad-demo-phone>.touchpad-phone{box-shadow:0 0 0 1px #e4e4e8,0 2px 3px #20202b0a,0 28px 35px -24px #24243045}.touchpad-live-contacts{width:0;height:0;animation:4.6s cubic-bezier(.4,0,.2,1) both touchpad-contact-move;position:absolute;top:47%;left:48%}.touchpad-live-contacts>i{opacity:0;width:7.5cqw;height:7.5cqw;transform:translate(calc(-50% + var(--contact-offset,0cqw)),-50%) scale(.65);background:#315c5b18;border-radius:50%;transition:opacity .35s,transform .45s cubic-bezier(.22,1,.36,1);position:absolute;box-shadow:0 0 0 1px #fff5}.touchpad-live-contacts>i[data-visible=true]{opacity:1;transform:translate(calc(-50% + var(--contact-offset,0cqw)),-50%) scale(1)}.touchpad-demo-caption{color:#86868b;justify-content:center;align-items:center;gap:14px;width:100%;font-size:11px;line-height:16px;display:flex;position:absolute;bottom:0;left:0}.touchpad-demo-label{text-align:right;margin-block:-6px;padding-block:6px;display:grid;overflow:hidden}.touchpad-demo-label>span{opacity:0;white-space:nowrap;grid-area:1/1;transition:opacity .9s linear,transform 1s;transform:translateY(6px)}.touchpad-demo-label>span[data-previous=true]{transform:translateY(-6px)}.touchpad-demo-label>span[data-active=true]{opacity:1;transform:translateY(0)}.touchpad-demo-progress{gap:4px;display:flex}.touchpad-demo-progress>i{background:#dedee3;border-radius:3px;width:22px;height:3px;overflow:hidden}.touchpad-demo-progress b{opacity:0;transform-origin:0;background:#9296a0;width:100%;height:100%;transition:opacity .35s;display:block}.touchpad-demo-progress>i[data-active=true] b{opacity:1;animation:4.6s linear both touchpad-progress}[data-gesture="1"] .touchpad-document{animation:4.6s cubic-bezier(.4,0,.2,1) both touchpad-document-scroll}[data-gesture="1"] .touchpad-live-contacts{animation-name:touchpad-contact-scroll}[data-gesture="1"] .touchpad-live-contacts>i:first-child{--contact-offset:-5cqw}[data-gesture="1"] .touchpad-live-contacts>i:nth-child(2){--contact-offset:5cqw}[data-gesture="1"] .touchpad-cursor{animation:none;top:32%;left:28%}[data-gesture="2"] .touchpad-desktop-track{animation:4.6s cubic-bezier(.4,0,.2,1) both touchpad-desktop-switch}[data-gesture="2"] .touchpad-window{animation:4.6s cubic-bezier(.4,0,.2,1) both touchpad-window-switch}[data-gesture="2"] .touchpad-desktop-space-next .touchpad-gallery-item>span{background:linear-gradient(135deg,#ece7f2,#d5cce2)}[data-gesture="2"] .touchpad-desktop-dock{animation:4.6s cubic-bezier(.4,0,.2,1) both touchpad-dock-switch}.touchpad-desktop-dock>i{background:#91a8bb;border-radius:4px;width:13px;height:13px}.touchpad-desktop-dock>i:nth-child(2){background:#bdd4bc}.touchpad-desktop-dock>i:nth-child(3){background:#daceb9}.touchpad-desktop-dock>i:nth-child(4){background:#c2b3d0}[data-gesture="2"] .touchpad-live-contacts{animation-name:touchpad-contact-swipe}[data-gesture="2"] .touchpad-live-contacts>i:first-child{--contact-offset:-10cqw}[data-gesture="2"] .touchpad-live-contacts>i:nth-child(3){--contact-offset:10cqw}[data-gesture="2"] .touchpad-cursor{animation:none;top:32%;left:30%}@keyframes touchpad-cursor-move{0%,12%,to{transform:translate(0)}42%{transform:translate(8cqw,-4.5cqw)}72%,84%{transform:translate(-6cqw,6cqw)}}@keyframes touchpad-contact-move{0%,12%,to{transform:translate(-50%,-50%)}42%{transform:translate(calc(7cqw - 50%),calc(-50% - 2.5cqw))}72%,84%{transform:translate(calc(-50% - 4.4cqw),calc(3.1cqw - 50%))}}@keyframes touchpad-contact-scroll{0%,15%,to{transform:translate(-50%,-50%)}50%,78%{transform:translate(-50%,calc(-50% - 4.4cqw))}}@keyframes touchpad-document-scroll{0%,15%,to{transform:translateY(0)}50%,78%{transform:translateY(-20cqw)}}@keyframes touchpad-contact-swipe{0%,20%,92%,to{transform:translate(0)}40%,78%{transform:translate(-5.6cqw)}}@keyframes touchpad-desktop-switch{0%,20%,92%,to{transform:translate(0,0)}40%,78%{transform:translate(-50%)}}@keyframes touchpad-window-switch{0%,50%,64%,to{transform:translateY(0)scale(1)}12%,40%,74%,92%{transform:translateY(-2%)scale(.86)}}@keyframes touchpad-dock-switch{0%,50%,64%,to{opacity:0;transform:translate(-50%,5px)}12%,40%,74%,92%{opacity:1;transform:translate(-50%)}}@keyframes touchpad-progress{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes touchpad-scroll{0%,18%,88%,to{transform:translateY(0)}48%,60%{transform:translateY(-35px)}}.touchpad-features{width:min(var(--content-max), 100%);margin:32px auto 0}.touchpad-native-feature,.touchpad-feature-grid>section{border-radius:36px;position:relative;overflow:hidden}.touchpad-native-feature{background:#121719;grid-template-columns:.75fr 1.25fr;align-items:center;gap:48px;min-height:430px;padding:54px 48px;display:grid}.touchpad-feature-heading{z-index:2;position:relative}.touchpad-feature-heading>p{color:#819093;max-width:360px;margin:18px 0 0;font-size:14px;line-height:1.8}.touchpad-native-feature .touchpad-feature-heading>p{color:#9aabaa;max-width:none;font-size:clamp(12px,1vw,14px)}.touchpad-feature-heading h2{letter-spacing:-.045em;color:#263336;text-wrap:balance;max-width:390px;margin:0;font-size:clamp(28px,3vw,40px);font-weight:750;line-height:1.28}.touchpad-native-feature h2{color:#f7f9fa;white-space:pre-line;max-width:340px;font-size:clamp(30px,3.2vw,44px)}.touchpad-native-visual{width:82%;margin-inline:auto;transform:translate(32px)rotate(-7deg)}.touchpad-phone{aspect-ratio:2.16;background:#fff;border-radius:5.7%/12.3%;width:100%;padding:.45%;position:relative;box-shadow:0 1px 2px #20332808,0 12px 20px -16px #20332830;container-type:inline-size}.touchpad-phone-screen{background:#000;border-radius:5.25cqw;width:100%;height:100%;position:relative;overflow:hidden;container-type:inline-size}.touchpad-app-sidebar{width:6.625cqw;position:absolute;inset:0 auto 0 0}.touchpad-app-device{width:5cqw;height:5cqw;position:absolute;top:2.75cqw;left:.75cqw}.touchpad-app-tools{flex-direction:column;align-items:center;gap:1cqw;width:5cqw;display:flex;position:absolute;bottom:2.75cqw;left:.75cqw}.touchpad-app-settings,.touchpad-app-color{flex:none;width:5cqw;height:5cqw}.touchpad-app-color{place-items:center;display:grid}.touchpad-app-color>i{aspect-ratio:1;background:conic-gradient(from 90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red);border-radius:50%;width:70.833%;padding:.1875cqw}.touchpad-app-color>i:after{content:"";background:var(--pad-color);border:.115cqw solid #000;border-radius:50%;width:100%;height:100%;transition:background .25s;display:block}.touchpad-app-pad{background:var(--pad-color);border-radius:4cqw;transition:background .25s;position:absolute;inset:1.25cqw 1.25cqw 1.25cqw 6.625cqw}.touchpad-app-touches{gap:2.4cqw;animation:4.6s ease-in-out infinite touchpad-scroll;display:flex;position:absolute;top:39%;left:44%}.touchpad-app-touches i{aspect-ratio:1;background:#315c5b18;border-radius:50%;width:7.5cqw;box-shadow:0 0 0 1px #fff5}.touchpad-feature-grid{grid-template-columns:1fr 1fr;gap:28px;margin-top:28px;display:grid}.touchpad-feature-grid>section{flex-direction:column;min-height:560px;padding:42px 40px 34px;display:flex}.touchpad-pocket-feature{background:linear-gradient(155deg,#f0f5f8,#dfeaf1)}.touchpad-pocket-visual{flex:1;min-height:330px;margin:28px -40px -34px;position:relative}.touchpad-pocket-visual>svg{width:100%;height:100%;position:absolute;inset:0}.touchpad-color-feature{background:#f1eff6}.touchpad-color-visual{flex:1;align-items:center;padding-top:40px;display:flex}.touchpad-color-visual>.touchpad-phone{transform:rotate(-6deg)}.touchpad-app-picker{background:#1e1e1e;border-radius:2.5cqw;width:42.5cqw;height:32.5cqw;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 5px 16px #0003}.touchpad-color-plane{background:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,transparent),hsl(var(--picker-hue,0) 100% 50%);border-radius:1.25cqw;position:absolute;inset:2.5cqw 2.5cqw 8.25cqw}.touchpad-color-plane i{top:var(--color-y,32%);left:var(--color-x,55%);background:var(--pad-color);pointer-events:none;border:.25cqw solid #fff;border-radius:50%;width:2.25cqw;height:2.25cqw;transition:top .6s,left .6s;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 0 .125cqw #000}.touchpad-hue-bar{background:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red);border-radius:1.25cqw;height:3cqw;position:absolute;bottom:2.625cqw;left:2.5cqw;right:2.5cqw}.touchpad-hue-bar i{left:var(--hue-x,62%);background:var(--pad-color);pointer-events:none;border:.375cqw solid #fff;border-radius:50%;width:2.75cqw;height:2.75cqw;transition:left .6s;position:absolute;top:50%;transform:translate(-50%,-50%)}@media (max-width:900px){.touchpad-native-feature{grid-template-columns:1fr;gap:40px;padding:44px}.touchpad-native-feature .touchpad-feature-heading{text-align:center}.touchpad-native-feature h2{max-width:100%;margin-inline:auto}.touchpad-native-feature .touchpad-feature-heading>p{margin-inline:auto;font-size:14px}.touchpad-native-visual{width:min(570px,100%);margin:20px auto;transform:rotate(-7deg)}.touchpad-feature-grid{gap:20px}.touchpad-feature-grid>section{min-height:460px;padding:32px 28px}.touchpad-pocket-visual{min-height:270px;margin:28px -28px -32px}.controller-intro{grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr);gap:20px;padding:32px}.controller-downloads .clipboard-download-button{grid-template-columns:28px minmax(0,1fr);gap:8px;padding:10px}.controller-downloads .clipboard-download-icon{width:28px}.controller-downloads .clipboard-download-copy strong{font-size:14px}.touchpad-window-viewport{padding:12px}.touchpad-window-sidebar{gap:9px;padding:12px 8px}}@media (max-width:720px){.controller-page{padding:0 18px 64px}.controller-hero{padding-top:84px;margin-inline:-18px;padding-inline:18px}.controller-intro{text-align:center;border-radius:28px;grid-template-columns:1fr;gap:36px;padding:32px 24px 26px}.controller-intro-copy{margin-block:0}.controller-intro-visual{width:min(540px,100%);margin-inline:auto}.touchpad-demo-stage{aspect-ratio:1.3}.touchpad-demo-phone{width:54%;bottom:13%}.touchpad-demo-caption{gap:10px;font-size:10px}.touchpad-window-viewport{padding:8px}.touchpad-document-heading{gap:4px;margin-bottom:9px}.touchpad-document-heading>b{height:3px}.touchpad-desktop-gallery{gap:9px 6px}.touchpad-window-sidebar{gap:7px;padding:10px 7px}.touchpad-window-sidebar>b{width:12px;height:12px}.controller-desktop-slot{gap:8px}.controller-desktop-slot[data-expanded=false]{position:static}.controller-desktop-slot[data-expanded=true]{height:68px}.touchpad-features{margin-top:22px}.touchpad-native-feature,.touchpad-feature-grid>section{border-radius:28px}.touchpad-native-feature{gap:30px;min-height:340px;padding:34px 26px}.touchpad-feature-heading h2{max-width:100%;font-size:28px}.touchpad-feature-grid{grid-template-columns:1fr;gap:22px;margin-top:22px}.touchpad-feature-grid>section{min-height:460px;padding:34px 26px}.touchpad-pocket-visual{min-height:260px;margin:28px -26px -34px}.touchpad-color-visual{padding-top:20px}}@media (prefers-reduced-motion:reduce){.touchpad-demo *,.touchpad-app-touches,.controller-desktop-entry,.controller-desktop-slot{transition:none!important;animation:none!important}}