@font-face{font-family:'Cascadia Code';src:url('assets/fonts/CascadiaCode.woff2') format('woff2');font-style:normal;font-weight:200 700;font-display:swap}
:root{color-scheme:dark;--bg:#000;--fg:#fff;--muted:#b8b8b8;--line:#303030;--max:1280px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{margin:0;background:var(--bg);color:var(--fg);font-family:'Cascadia Code',monospace;font-size:16px;font-weight:400;line-height:1.75;-webkit-font-smoothing:antialiased}
::selection{background:#fff;color:#000}
a{color:inherit;text-decoration:none;text-underline-offset:5px}
a:hover{text-decoration:underline}
a:focus-visible,summary:focus-visible,video:focus-visible{outline:2px solid white;outline-offset:7px}
img{display:block;max-width:100%;height:auto}
figure,p,h1,h2,h3,dl,dd{margin:0}
ul,ol{margin:0;padding:0}
button,summary{font:inherit}
.wrap{width:calc(100% - 112px);max-width:var(--max);margin-inline:auto}
.section{padding-block:100px;scroll-margin-top:20px}
.eyebrow,.section-label,.figure-note,.affiliation,.component-labels,.demo-heading>span,.application-heading>span,.application-footnote,.study-note,.publication-venue,.acknowledgment,.site-footer,.hero-figure figcaption{font-size:14px;line-height:1.7}
.eyebrow{text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.site-header{height:88px;display:flex;align-items:center;justify-content:space-between;gap:32px;padding-inline:56px;border-bottom:1px solid var(--line);background:#000;position:relative;z-index:5}
.wordmark{font-size:23px;font-weight:650;display:inline-flex;align-items:center;gap:12px;letter-spacing:-1px;line-height:1}
.wordmark:hover{text-decoration:none}
.ring-mark{height:22px;width:19px;border:1.5px solid white;border-radius:50%;transform:rotate(-28deg);position:relative}
.ring-mark:after{content:'';position:absolute;inset:3px -4px 3px 4px;border:1.5px solid white;border-radius:50%;background:#000}
.site-header nav{display:flex;gap:24px;margin-left:auto;margin-right:40px;font-size:18px;font-weight:450;color:#ddd}
.site-header nav a:hover{color:#fff}
.header-paper{font-size:16px;white-space:nowrap}.header-paper span{margin-left:14px}
.hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:12px;min-height:660px;padding-top:65px;padding-bottom:60px}
.hero-copy{position:relative;z-index:1}.hero .eyebrow{display:flex;align-items:center;gap:12px;color:#c6c6c6}.separator{color:#666;padding-inline:6px}
.status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:white}
h1{font-size:clamp(100px,11.8vw,168px);line-height:1.12;font-weight:500;letter-spacing:-.085em;margin:24px 0 14px -9px}
.title-period{color:#767676}
.hero-subtitle{font-size:clamp(21px,2.2vw,31px);line-height:1.4;font-weight:400;letter-spacing:-.045em}
.hero-description{color:var(--muted);max-width:430px;font-size:16px;line-height:1.9;margin-top:24px}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}.button{border:1px solid #555;min-height:46px;padding:12px 20px;display:inline-flex;align-items:center;justify-content:space-between;gap:38px;font-size:14px;transition:background .18s,color .18s,border-color .18s}
.button:hover{background:#171717;border-color:white;text-decoration:none}.button-solid{background:#fff;color:#000;border-color:#fff}.button-solid:hover{background:#dcdcdc;color:#000}
.hero-figure{align-self:stretch;display:flex;flex-direction:column;justify-content:center;position:relative}
.hero-figure img{width:100%;aspect-ratio:1.02;object-fit:contain}
.hero-figure figcaption{display:flex;justify-content:space-between;color:#aaa;position:absolute;bottom:5px;left:24px;right:0;font-size:13px}
.project-meta{padding:24px 0 28px;border-block:1px solid var(--line)}
.authors{display:flex;flex-wrap:wrap;gap:10px 26px;font-size:16px;color:#e5e5e5}.authors sup{font-size:12px;vertical-align:super;padding-left:2px}.affiliation{display:flex;justify-content:space-between;margin-top:12px;color:#aaa;font-size:13px}
.section-label{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:18px;color:#aaa;text-transform:uppercase;letter-spacing:.08em;font-size:13px}
.overview .section-label{border-top:0;padding-top:0}
.section-intro{display:grid;grid-template-columns:1fr 1fr;gap:64px;margin-top:46px;margin-bottom:52px}
h2{font-size:clamp(27px,3.2vw,43px);line-height:1.27;letter-spacing:-.055em;font-weight:400}
.intro-copy{max-width:520px;padding-top:3px;color:var(--muted);font-size:16px;line-height:1.95}.intro-copy p+p{margin-top:18px}.intro-copy p:first-child{color:#d0d0d0}
.spec-strip{display:grid;grid-template-columns:repeat(4,1fr);border-block:1px solid var(--line);padding:28px 0 32px}
.spec-strip>div{display:flex;flex-direction:column-reverse;padding-left:28px;border-left:1px solid var(--line)}.spec-strip>div:first-child{padding-left:0;border:0}.spec-strip dt{font-size:13px;color:#aaa;margin-top:10px}.spec-strip dd{font-size:clamp(32px,4vw,53px);line-height:1.2;font-weight:300;letter-spacing:-.06em}.spec-strip dd span{font-size:.6em;letter-spacing:-.06em;margin-left:3px}
.demo-section{padding-bottom:14px;scroll-margin-top:36px}.demo-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}.demo-heading h2{font-size:25px;letter-spacing:-.04em}.demo-heading>span{font-size:13px}
video{width:100%;display:block;aspect-ratio:16/9;background:#101010;border:1px solid var(--line);object-fit:contain}.figure-note{color:#aaa;margin-top:12px;font-size:13px}
.exploded-figure img{width:100%;aspect-ratio:2.55;object-fit:contain}.component-labels{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;border-bottom:1px solid var(--line);padding:18px 0 32px;color:#aaa;font-size:13px}.component-labels b{color:#fff;display:block;margin-bottom:5px;font-weight:400}
.hardware-details{display:grid;grid-template-columns:1fr 1fr;gap:80px;margin-top:56px}.hardware-details h3{font-size:23px;font-weight:400;line-height:1.45;letter-spacing:-.04em;margin-top:14px}.hardware-details article>p{font-size:16px;color:#aaa;max-width:450px;line-height:1.9;margin-top:20px}.touch-pcb{width:100%;height:auto;margin-top:32px}
.technical-specs{font-size:14px}.technical-specs>div{border-bottom:1px solid var(--line);padding:16px 0;display:flex;justify-content:space-between;gap:20px}.technical-specs>div:first-child{padding-top:0}.technical-specs dt{color:#909090}.technical-specs dd{text-align:right;max-width:55%;color:#ddd}
.assembly{margin-top:48px;border-block:1px solid var(--line)}summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:23px;font-size:16px}summary::-webkit-details-marker{display:none}summary:hover{color:#bcbcbc}.details-hint{display:flex;align-items:center;gap:32px;font-size:13px;color:#aaa}.expand-icon{position:relative;display:inline-block;width:12px;height:12px;flex-shrink:0}.expand-icon:before,.expand-icon:after{content:'';position:absolute;background:currentColor;top:5px;left:0;width:12px;height:1px}.expand-icon:after{transform:rotate(90deg)}details[open]>summary .expand-icon:after{transform:rotate(0)}
.assembly-grid{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:24px 16px;padding:12px 0 28px}.assembly-grid img{width:100%;aspect-ratio:1.5;object-fit:cover}.assembly-grid span{display:block;font-size:13px;margin-top:10px;color:#aaa}
/* The six previews crop panels from the same SVG; radio controls keep selection usable without JavaScript. */
.interaction{padding-top:0}
.gesture-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center}
.gesture-preview-column{min-width:0;width:100%;max-width:360px;justify-self:center}
.gesture-previews{position:relative;aspect-ratio:1;overflow:hidden;background:#151719;border:1px solid var(--line)}
.gesture-panel{position:absolute;inset:0;overflow:hidden;opacity:0;visibility:hidden;transition:opacity .18s ease}
.gesture-panel img{position:absolute;width:307.926829%;max-width:none;height:auto}
.gesture-help{font-size:12px;line-height:1.8;color:#aaa;margin-top:14px;text-align:center}
.gesture-options{border:0;padding:0;margin:0;min-width:0}
.gesture-list{list-style:none;border-top:1px solid var(--line)}
.gesture-list li{border-bottom:1px solid var(--line)}
.gesture-option{display:flex;align-items:center;gap:20px;padding:18px 16px;cursor:pointer;border-left:2px solid transparent;position:relative;transition:background .18s,border-color .18s}
.gesture-option:has(input:checked){background:#151515;border-left-color:#fff}
.gesture-option:has(input:focus-visible){outline:2px solid #fff;outline-offset:3px;z-index:1}
.gesture-number{color:#999;font-size:13px;flex-shrink:0}
.gesture-copy{min-width:0}
.gesture-name{display:block;font-size:16px;font-weight:450;line-height:1.5}
.gesture-description{display:block;color:#aaa;font-size:14px;line-height:1.7;margin-top:3px}
.gesture-symbol{margin-left:auto;min-width:44px;text-align:center;font-size:25px;font-weight:200;letter-spacing:-.1em}
:where(.gesture-layout:has(#gesture-single-tap:checked)) .gesture-panel[data-gesture="single-tap"]{opacity:1;visibility:visible}
:where(.gesture-layout:has(#gesture-double-tap:checked)) .gesture-panel[data-gesture="double-tap"]{opacity:1;visibility:visible}
:where(.gesture-layout:has(#gesture-long-press:checked)) .gesture-panel[data-gesture="long-press"]{opacity:1;visibility:visible}
:where(.gesture-layout:has(#gesture-slide:checked)) .gesture-panel[data-gesture="slide"]{opacity:1;visibility:visible}
:where(.gesture-layout:has(#gesture-pinch:checked)) .gesture-panel[data-gesture="pinch"]{opacity:1;visibility:visible}
:where(.gesture-layout:has(#gesture-spread:checked)) .gesture-panel[data-gesture="spread"]{opacity:1;visibility:visible}
@media(hover:hover){
.gesture-option:hover{background:#202020;border-left-color:#fff}
.gesture-option:hover .gesture-number{color:#fff}
.gesture-layout:not(:has(input:focus-visible)):has(.gesture-option:hover) .gesture-panel{opacity:0;visibility:hidden}
.gesture-layout:not(:has(input:focus-visible)):has(.gesture-option[data-gesture="single-tap"]:hover) .gesture-panel[data-gesture="single-tap"]{opacity:1;visibility:visible}
.gesture-layout:not(:has(input:focus-visible)):has(.gesture-option[data-gesture="double-tap"]:hover) .gesture-panel[data-gesture="double-tap"]{opacity:1;visibility:visible}
.gesture-layout:not(:has(input:focus-visible)):has(.gesture-option[data-gesture="long-press"]:hover) .gesture-panel[data-gesture="long-press"]{opacity:1;visibility:visible}
.gesture-layout:not(:has(input:focus-visible)):has(.gesture-option[data-gesture="slide"]:hover) .gesture-panel[data-gesture="slide"]{opacity:1;visibility:visible}
.gesture-layout:not(:has(input:focus-visible)):has(.gesture-option[data-gesture="pinch"]:hover) .gesture-panel[data-gesture="pinch"]{opacity:1;visibility:visible}
.gesture-layout:not(:has(input:focus-visible)):has(.gesture-option[data-gesture="spread"]:hover) .gesture-panel[data-gesture="spread"]{opacity:1;visibility:visible}
}
.processing{margin-top:48px;border-block:1px solid var(--line);padding-block:24px}.processing>.eyebrow{font-size:13px}.processing ol{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:20px}.processing li{font-size:14px;position:relative;padding-right:24px;min-width:0}.processing li:not(:last-child):after{content:'→';position:absolute;right:8px;top:0;color:#666}.processing li span{display:block;font-size:12px;color:#aaa;margin-top:5px}
.applications{padding-top:0}.application-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px 32px}.application-image{overflow:hidden;background:#111}.application-image img{width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform .35s,filter .35s;filter:grayscale(1)}.application-grid article:hover img{transform:scale(1.025);filter:grayscale(0)}.application-heading{margin-top:20px}.application-heading>span{text-transform:uppercase;color:#aaa;font-size:12px;letter-spacing:.08em}.application-heading h3{font-weight:400;font-size:20px;letter-spacing:-.035em;margin-top:6px}.application-grid article>p{font-size:16px;line-height:1.9;color:#aaa;max-width:480px;margin-top:10px}.application-footnote{font-size:13px;color:#aaa;margin-top:40px;border-top:1px solid var(--line);padding-top:20px}
.evaluation{padding-top:0}.results{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--line);padding:36px 0}.results>div{padding-inline:32px;border-left:1px solid var(--line)}.results>div:first-child{padding-left:0;border-left:0}.results dd{font-size:clamp(40px,5.8vw,76px);letter-spacing:-.07em;font-weight:300;line-height:1.1;margin-bottom:22px}.results dd span{font-size:.5em}.results dt{font-size:16px}.results p{color:#aaa;font-size:13px;margin-top:7px}.study-note{color:#aaa;font-size:16px;max-width:880px;line-height:1.9;margin-top:24px}
.publication{padding-top:0}.publication-layout{display:grid;grid-template-columns:1.2fr 1fr;gap:96px;margin-top:48px}.publication h2{font-size:27px;line-height:1.5;margin-top:18px;letter-spacing:-.04em}.publication-authors{font-size:14px;color:#aaa;line-height:1.9;margin-top:24px}.publication-venue{font-size:13px;color:#aaa;margin-top:20px;line-height:1.9}.resource-links{align-self:center}.resource-links>a{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:23px 0;gap:16px;font-size:13px;transition:padding .2s}.resource-links>a:last-child{border-bottom:1px solid var(--line)}.resource-links>a:hover{padding-inline:10px;text-decoration:none}.resource-links small{display:block;font-size:12px;line-height:1.8;color:#aaa;margin-top:8px;overflow-wrap:anywhere}.resource-links>a>span:last-child{font-size:22px}
.citation{margin-top:48px;border-block:1px solid var(--line)}.citation summary{font-size:14px}.citation pre{overflow-x:auto;padding:20px 24px 28px;background:#0b0b0b;margin:0 0 24px;color:#aaa;font:13px/1.8 'Cascadia Code',monospace}.citation code{font:inherit}.acknowledgment{color:#777;font-size:13px;margin-top:24px}.site-footer{border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:30px 40px;color:#aaa;font-size:13px}.site-footer .wordmark{color:#fff;font-size:24px}.site-footer a:last-child{color:#ccc}
.sr-only,.skip-link:not(:focus){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link:focus{position:fixed;z-index:99;top:12px;left:12px;padding:12px 20px;background:#fff;color:#000}
@media(min-width:1600px){.hero{min-height:760px}.hero-figure img{max-height:620px}.site-header{padding-inline:max(56px,calc((100vw - 1280px)/2))}}
@media(max-width:1100px){.wrap{width:calc(100% - 64px)}.site-header{padding-inline:32px}.site-header nav{gap:18px;margin-right:10px}.hero{min-height:600px}.hero-description{max-width:360px}.hero-figure figcaption{left:0;gap:20px;flex-wrap:wrap}.hero-figure figcaption span:last-child{display:none}.section-intro{gap:40px}.hardware-details{gap:40px}.technical-specs>div{flex-direction:column;gap:5px}.technical-specs dd{text-align:left;max-width:none}.gesture-layout{gap:36px}.publication-layout{gap:48px}.results>div{padding-inline:22px}}
@media(max-width:1000px){.site-header{height:auto;min-height:88px;flex-wrap:wrap;padding-block:22px;gap:20px}.site-header nav{order:3;width:100%;margin:0;justify-content:space-between;border-top:1px solid var(--line);padding-top:16px;gap:14px}.header-paper{margin-left:auto}}
@media(max-width:760px){html{scroll-padding-top:28px}.wrap{width:calc(100% - 40px)}.site-header{height:auto;min-height:76px;padding:22px 20px;gap:20px;flex-wrap:wrap}.site-header .wordmark{font-size:21px}.site-header nav{order:3;width:100%;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));padding-top:15px;border-top:1px solid var(--line);font-size:16px;gap:12px 20px}.header-paper{font-size:16px;margin-left:auto}.header-paper span{margin-left:6px}.hero{grid-template-columns:1fr;padding-top:44px;padding-bottom:24px;gap:12px;min-height:0}.hero .eyebrow{font-size:13px}.hero h1{font-size:114px;margin-top:23px;margin-left:-5px;margin-bottom:12px}.hero-subtitle{font-size:26px}.hero-description{max-width:440px;font-size:16px;margin-top:20px}.actions{margin-top:26px}.button{padding:11px 17px;gap:30px;min-height:44px}.hero-figure{margin-top:-8px;max-width:500px;width:100%;justify-self:center}.hero-figure img{aspect-ratio:1.3;object-fit:cover}.hero-figure figcaption{position:static;justify-content:space-between;font-size:12px}.hero-figure figcaption span:last-child{display:block}.project-meta{padding:22px 0}.authors{gap:8px 20px;font-size:13px;line-height:1.9}.affiliation{align-items:start;gap:15px;font-size:12px;flex-wrap:wrap}.section{padding-block:64px}.section-label{font-size:12px;gap:20px}.section-label{flex-wrap:wrap}.section-label span:last-child{text-align:left;max-width:100%}.section-intro{grid-template-columns:1fr;gap:25px;margin-block:30px 34px}h2{font-size:32px}.intro-copy{font-size:16px;max-width:560px}.spec-strip{grid-template-columns:1fr 1fr;padding:0}.spec-strip>div{padding:24px 0 24px 20px}.spec-strip>div:first-child{padding:24px 0}.spec-strip>div:nth-child(3){padding-left:0;border-left:0}.spec-strip>div:nth-child(n+3){border-top:1px solid var(--line)}.spec-strip dd{font-size:42px}.spec-strip dt{font-size:12px}.demo-heading{align-items:start;flex-direction:column;gap:12px;margin-bottom:20px}.demo-heading h2{font-size:25px}.demo-heading>span{font-size:12px}.figure-note{font-size:12px;line-height:1.8}.component-labels{grid-template-columns:repeat(3,1fr);row-gap:20px;font-size:12px;padding-bottom:24px}.exploded-figure img{aspect-ratio:1.9;object-fit:contain}.hardware-details{grid-template-columns:1fr;gap:32px;margin-top:32px}.hardware-details h3{font-size:22px}.hardware-details article>p{font-size:16px;max-width:100%}.touch-pcb{margin-top:22px}.technical-specs>div{flex-direction:column;gap:6px;font-size:14px}.technical-specs dd{text-align:left;max-width:100%}.assembly{margin-top:32px}.assembly summary{font-size:13px;gap:20px}.details-hint{font-size:0;gap:0}.assembly-grid{grid-template-columns:1fr 1fr;gap:20px 12px}.assembly-grid span{font-size:12px}.interaction,.applications,.evaluation,.publication{padding-top:0}.gesture-layout{grid-template-columns:1fr;gap:24px}.gesture-preview-column{width:100%;max-width:300px;margin-inline:auto}.gesture-option{gap:16px;padding:16px 12px}.gesture-name{font-size:16px}.gesture-description{font-size:14px}.processing{margin-top:32px}.processing ol{grid-template-columns:1fr 1fr;gap:26px 18px}.processing li{font-size:14px}.processing li:nth-child(2):after{display:none}.processing li:not(:last-child):after{right:0}.processing li span{font-size:12px;max-width:90%}.application-grid{grid-template-columns:1fr;gap:36px}.application-heading{margin-top:16px}.application-heading h3{font-size:21px}.application-grid article>p{max-width:100%}.application-image img{filter:grayscale(0)}.application-footnote{margin-top:28px}.results{grid-template-columns:1fr;padding:0}.results>div,.results>div:first-child{padding:28px 0;display:grid;grid-template-columns:1fr 1fr;border-left:0;column-gap:18px;align-items:center}.results>div+div{border-top:1px solid var(--line)}.results dd{font-size:52px;grid-row:span 2;margin:0}.results dt{font-size:14px;align-self:end}.results p{font-size:14px;align-self:start}.study-note{font-size:14px}.publication-layout{grid-template-columns:1fr;gap:32px;margin-top:30px}.publication h2{font-size:24px;line-height:1.45}.publication-authors{font-size:13px}.resource-links>a{font-size:16px;padding-block:20px}.citation{margin-top:32px}.citation pre{padding:16px;font-size:13px}.site-footer{flex-wrap:wrap;gap:20px;padding-block:26px}.site-footer p{font-size:12px}.site-footer>a:last-child{margin-left:auto;font-size:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}
@media print{body{background:white;color:black}a{color:black}.site-header,.actions,video,.demo-section,.site-footer,.resource-links{display:none}.wrap{width:100%}.section{padding-block:24px}h1{font-size:72px}.hero{min-height:0}.eyebrow,.intro-copy,.study-note,.section-label{color:#444}.section-intro{margin-block:20px}details:not([open]){display:none}}