@charset "UTF-8";
:root{--paper:#f8f9f5;--surface:#fff;--ink:#1c302b;--muted:#62706a;--green:#205843;--deep:#102e2b;--line:#dde2d7;--lime:#c8ef87;--serif:Georgia,'Times New Roman',serif;--sans:Arial,Helvetica,'PingFang SC','Microsoft YaHei',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;-webkit-font-smoothing:antialiased}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}a:hover{color:var(--green)}button{cursor:pointer}button:disabled{cursor:default}img{max-width:100%;display:block}::selection{background:#c8ef87;color:var(--deep)}:focus-visible{outline:3px solid #659649;outline-offset:5px;border-radius:3px}.wrap{width:min(1120px,calc(100% - 80px));margin:auto}.skip{position:absolute;top:-80px;left:20px;padding:12px;background:var(--deep);color:white;z-index:50}.skip:focus{top:10px}.site-header{height:88px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:13px;font-size:14px;font-weight:700;letter-spacing:.02em}.monogram{display:grid;place-items:center;width:35px;height:35px;color:var(--paper);background:var(--deep);font-family:var(--serif);font-size:17px;font-weight:400;border-radius:50%}.nav{display:flex;align-items:center;gap:30px;font-size:13px}.nav a{padding:10px 0}.nav .nav-contact{display:flex;gap:18px;border-bottom:1px solid var(--ink)}.hero{display:grid;grid-template-columns:minmax(0,1fr) 234px;gap:80px;padding:70px 0 60px;align-items:start}.eyebrow{text-transform:uppercase;letter-spacing:.15em;font-size:11px;font-weight:700;display:flex;align-items:center;gap:9px;margin:0 0 24px}.status-dot{width:7px;height:7px;border-radius:50%;background:#719744;box-shadow:0 0 0 4px #71974415}.hero h1{font-family:var(--serif);font-size:70px;font-weight:400;letter-spacing:-3px;line-height:1.06;margin:0 0 21px}.chinese-name{display:inline-block;font-family:var(--sans);font-size:25px;letter-spacing:.08em;color:#607365;margin-left:16px;vertical-align:middle;font-weight:400}.hero-statement{font-family:var(--serif);font-size:29px;line-height:1.4;letter-spacing:-.6px;max-width:690px;margin:0 0 25px}.hero-statement em{font-style:normal;color:var(--green);border-bottom:1px solid #9bb885}.intro{font-size:15px;line-height:1.85;max-width:697px;margin:0;color:#53635b}.intro a{color:var(--ink);border-bottom:1px solid #c0c9ba}.intro strong{font-weight:600;color:var(--ink)}.profile-links{display:flex;gap:23px;margin-top:25px;font-size:12px;font-weight:700}.profile-links a{display:flex;gap:9px;align-items:center;padding:3px 0}.profile-links svg{width:15px;height:15px}.portrait-wrap{position:relative;padding:10px;border:1px solid #cbd5c5;border-radius:3px;background:#eef1e9;transform:rotate(2deg);margin-top:7px}.portrait-wrap img{width:212px;height:236px;object-fit:cover;object-position:center;border-radius:1px;filter:saturate(.8)}.portrait-caption{font-family:var(--serif);font-style:italic;display:block;text-align:center;font-size:13px;padding:12px 0 4px}.profile-note{margin-top:24px;display:flex;gap:12px;align-items:start;font-size:11px;line-height:1.8;color:var(--muted)}.profile-note::before{content:'';width:22px;height:1px;background:var(--green);margin-top:9px;flex-shrink:0}.profile-note strong{display:block;color:var(--ink);font-size:12px}.research-panel{background:var(--deep);border-radius:16px;padding:34px 34px 26px;color:#eef3e7;position:relative;overflow:hidden}.research-top{display:flex;justify-content:space-between;align-items:start;gap:30px}.research-top h2{font-family:var(--serif);font-size:33px;line-height:1.27;letter-spacing:-.6px;font-weight:400;margin:0;max-width:610px}.research-top .eyebrow{color:var(--lime);margin:4px 0 0;font-size:10px;white-space:nowrap;letter-spacing:.12em}.research-sub{color:#abc0b5;font-size:12px;line-height:1.6;margin:13px 0 26px}.research-triptych{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.research-link{display:block;border-top:1px solid #446055;padding-top:14px;text-align:left;transition:color .2s}.research-link:hover{color:var(--lime)}.research-link-title{display:flex;justify-content:space-between;align-items:center;font-size:15px;margin-bottom:10px}.research-link-title span{font-size:10px;letter-spacing:.13em;color:#8bab9b;margin-right:10px}.research-link-title b{font-weight:500;margin-right:auto}.research-link-title i{font-style:normal;font-size:20px;font-weight:400;color:var(--lime)}.research-link .showcase{width:100%;height:auto;aspect-ratio:8/5;object-fit:contain;border-radius:8px;mix-blend-mode:normal}.research-link p{color:#a9c0b3;font-size:11px;line-height:1.6;margin:8px 0 0}.experience{display:grid;grid-template-columns:166px 1fr;gap:30px;padding:28px 0 34px;border-bottom:1px solid var(--line)}.experience>span{font-size:10px;text-transform:uppercase;letter-spacing:.13em;font-weight:700;color:var(--muted);padding-top:4px}.experience p{font-size:14px;line-height:1.8;margin:0;color:var(--muted)}.experience a{color:var(--ink);border-bottom:1px solid #bac9b0}.experience a:hover{border-color:var(--green)}.publications{padding-top:61px}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:25px}.heading-main{display:flex;align-items:baseline;gap:16px}.section-heading h2,.about h2{font-family:var(--serif);font-size:42px;font-weight:400;letter-spacing:-1.2px;margin:0}.section-heading .small{font-size:11px;color:var(--muted)}.motion-toggle{display:flex;gap:8px;align-items:center;background:none;border:1px solid var(--line);padding:9px 13px;font-size:11px;border-radius:40px;color:var(--muted)}.motion-toggle:hover{border-color:#829477;color:var(--ink)}.motion-toggle svg{width:12px;height:12px}.filter-row{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:16px}.filter{border:1px solid transparent;border-radius:30px;background:transparent;padding:9px 15px;font-size:11px;color:#5c6b60;white-space:nowrap}.filter:hover{background:#e9eee1}.filter[aria-pressed=true]{background:var(--ink);color:#f7f8f3}.search-row{display:flex;justify-content:space-between;gap:20px;align-items:center;padding-bottom:18px;border-bottom:1px solid var(--line)}.search-wrap{display:flex;align-items:center;gap:9px;color:var(--muted);flex:1}.search-wrap svg{width:14px;height:14px}.search-wrap input{width:min(100%,390px);background:none;border:0;color:var(--ink);padding:7px 0;font-size:12px;outline-offset:4px}.search-wrap input::placeholder{color:#7c877c}.sort-wrap{display:flex;gap:8px;align-items:center;color:var(--muted);font-size:10px}.sort-wrap select{font-size:11px;border:0;background:transparent;color:var(--ink);padding:6px 2px}.result-count{font-size:10px;color:var(--muted);min-width:62px;text-align:right}.paper{display:grid;grid-template-columns:338px minmax(0,1fr);gap:37px;padding:29px 0;border-bottom:1px solid var(--line);align-items:center}.paper[hidden]{display:none}.paper-visual{margin:0;align-self:center}.demo-button{display:block;width:100%;padding:0;border:0;background:var(--deep);border-radius:10px;overflow:hidden;position:relative;aspect-ratio:8/5;text-align:left;box-shadow:0 2px 9px #21332806}.demo-button img{width:100%;height:100%;object-fit:contain;transition:transform .5s}.demo-button:hover img{transform:scale(1.025)}.expand-icon{position:absolute;right:10px;bottom:10px;width:24px;height:24px;display:grid;place-items:center;font-size:15px;border-radius:50%;background:#f4f8ecd9;color:var(--ink);opacity:0;transform:translateY(3px);transition:.2s}.demo-button:hover .expand-icon,.demo-button:focus-visible .expand-icon{opacity:1;transform:translateY(0)}.demo-caption{display:flex;justify-content:space-between;color:#7a887c;font-size:9px;letter-spacing:.02em;padding-top:9px}.paper-meta{display:flex;align-items:center;flex-wrap:wrap;gap:9px;margin:0 0 10px}.venue{font-size:10px;font-weight:700;letter-spacing:.065em;text-transform:uppercase;color:var(--green)}.award{font-size:9px;background:#f0e9d9;color:#856126;padding:4px 7px;border-radius:3px}.paper h3{font-size:21px;line-height:1.35;letter-spacing:-.3px;font-weight:600;margin:0 0 10px}.paper h3 a:hover{color:var(--green)}.authors{font-size:11px;line-height:1.75;color:#7d887f;margin:0 0 9px}.authors strong{color:#425d4b;font-weight:700}.summary{font-size:13px;line-height:1.75;color:#536258;margin:0 0 12px}.paper-tags{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 12px}.paper-tags span{color:#73856e;font-size:9px;letter-spacing:.025em}.paper-tags span+span::before{content:'·';margin-right:10px;color:#abb5a4}.paper-links{display:flex;gap:19px;align-items:center;font-size:10px;font-weight:700}.paper-links a,.cite-button{padding:4px 0;border:0;background:none;color:var(--green);font-size:10px;font-weight:700}.paper-links a:hover,.cite-button:hover{color:#132f20;text-decoration:underline;text-underline-offset:4px}.paper-links a span{font-size:12px;font-weight:400;margin-left:3px}.empty{padding:65px 15px;text-align:center;color:var(--muted)}.empty button{display:block;margin:17px auto 0;background:var(--deep);border:0;border-radius:30px;padding:10px 18px;color:var(--paper);font-size:12px}.publication-note{font-size:10px;color:#81907f;margin-top:15px;line-height:1.7}.about{padding:59px 0 60px}.about-grid{display:grid;grid-template-columns:1.45fr 1fr;gap:75px;margin-top:29px}.about h3{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin:0 0 20px;color:var(--muted)}.timeline{border-left:1px solid #cdd6c4;padding-left:25px;margin-left:3px}.timeline-item{position:relative;margin-bottom:23px}.timeline-item::before{content:'';position:absolute;left:-29px;top:6px;width:7px;height:7px;background:var(--paper);border:1px solid #8b9b7d;border-radius:50%}.timeline-item:first-child::before{background:var(--green);border-color:var(--green)}.timeline-item strong{font-size:14px;font-weight:500;display:block;margin-bottom:7px}.timeline-item p{font-size:12px;color:var(--muted);margin:0;line-height:1.7}.about-side p{font-size:12px;line-height:1.8;color:var(--muted)}.about-side a{color:var(--green);border-bottom:1px solid #c1ceba}.about-side .service{margin-top:27px}.contact-band{display:flex;align-items:center;justify-content:space-between;gap:30px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0 28px}.contact-band p{font-family:var(--serif);font-size:25px;margin:0;letter-spacing:-.3px}.contact-band a{font-size:12px;display:flex;gap:20px;color:var(--green)}.footer{padding:27px 0 31px;font-size:10px;color:#7f8b7e;display:flex;justify-content:space-between;gap:20px}.footer a{border-bottom:1px solid #c6cfbe}.footer-left{display:flex;gap:14px;align-items:center}.footer .monogram{width:25px;height:25px;font-size:12px;background:none;border:1px solid #bdc9b4;color:var(--green)}dialog{width:min(900px,calc(100% - 30px));max-height:90vh;border:1px solid #dde7d4;border-radius:15px;background:var(--paper);color:var(--ink);padding:0;box-shadow:0 30px 100px #061b1660}dialog::backdrop{background:#081d17c4;backdrop-filter:blur(5px)}.dialog-head{display:flex;align-items:start;justify-content:space-between;gap:22px;padding:22px 24px 17px}.dialog-head h2{font-size:17px;line-height:1.5;margin:0;font-weight:500}.dialog-close{flex-shrink:0;border:1px solid var(--line);border-radius:50%;width:30px;height:30px;background:none;font-size:20px;line-height:20px;color:var(--ink)}.dialog-body{padding:0 24px 24px}.dialog-media{width:100%;max-height:59vh;object-fit:contain;background:var(--deep);border-radius:8px}.dialog-note{color:var(--muted);font-size:12px;line-height:1.7;margin:17px 0 8px}.dialog-links{display:flex;gap:20px;margin:15px 0 0;font-size:12px;color:var(--green)}.citation-text{width:100%;min-height:230px;padding:17px;border:1px solid var(--line);border-radius:6px;background:#eef2e8;font-family:monospace;font-size:12px;line-height:1.65;resize:vertical}.copy-citation{border:0;background:var(--deep);color:white;padding:11px 18px;border-radius:6px;margin-top:13px;font-size:12px}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:var(--deep);color:var(--paper);font-size:12px;border-radius:50px;padding:12px 20px;z-index:100}.toast[hidden]{display:none}body.modal-open{overflow:hidden}
@media(min-width:1500px){.wrap{width:min(1180px,calc(100% - 100px))}.hero{gap:120px}.paper{grid-template-columns:350px minmax(0,1fr);gap:45px}}
@media(max-width:960px){.wrap{width:calc(100% - 48px)}.hero{gap:40px;grid-template-columns:1fr 195px;padding-top:50px}.hero h1{font-size:55px}.chinese-name{font-size:20px;margin-left:12px}.hero-statement{font-size:25px}.portrait-wrap img{height:200px;width:173px}.research-top{display:block}.research-top .eyebrow{margin:15px 0 0}.research-top h2{font-size:30px}.paper{grid-template-columns:285px minmax(0,1fr);gap:25px}.paper h3{font-size:19px}.research-panel{padding:28px 25px 23px}.research-triptych{gap:13px}.research-link-title{font-size:13px}.about-grid{gap:40px}}
@media(max-width:700px){html{scroll-padding-top:20px}.wrap{width:calc(100% - 38px)}.site-header{height:73px}.brand{font-size:12px;gap:9px}.monogram{width:30px;height:30px;font-size:15px}.nav{gap:17px;font-size:11px}.nav-contact{display:none!important}.hero{grid-template-columns:1fr;gap:30px;padding:40px 0 36px}.eyebrow{font-size:9px;margin-bottom:19px}.hero h1{font-size:48px;letter-spacing:-2px}.chinese-name{font-size:18px;margin-left:9px}.hero-statement{font-size:26px;line-height:1.36;margin-bottom:19px}.intro{font-size:13px;line-height:1.85}.profile-links{gap:22px;margin-top:21px;font-size:11px}.hero-profile{display:flex;align-items:center;gap:27px}.portrait-wrap{width:120px;margin-top:0;flex-shrink:0;padding:6px}.portrait-wrap img{width:106px;height:111px}.portrait-caption{font-size:9px;padding:7px 0 2px}.profile-note{font-size:11px;margin:0}.research-panel{padding:24px 19px 18px;border-radius:12px}.research-top h2{font-size:27px;line-height:1.32}.research-top .eyebrow{font-size:9px}.research-sub{font-size:11px;margin:13px 0 20px}.research-triptych{grid-template-columns:1fr;gap:15px}.research-link{display:grid;grid-template-columns:1fr 150px;grid-template-rows:auto 1fr;column-gap:15px;padding-top:16px}.research-link-title{grid-column:1;font-size:15px;align-self:start;margin-top:7px}.research-link-title i{display:none}.research-link .showcase{grid-column:2;grid-row:1/3;align-self:center}.research-link p{grid-column:1;margin:0;font-size:10px;padding-right:5px}.research-link-title span{font-size:9px;margin-right:7px}.experience{grid-template-columns:1fr;gap:11px;padding:24px 0}.experience p{font-size:12px;line-height:1.9}.publications{padding-top:40px}.section-heading h2,.about h2{font-size:35px}.heading-main{gap:10px}.section-heading{margin-bottom:21px}.section-heading .small{font-size:10px}.motion-toggle{font-size:10px;padding:8px 10px}.filter-row{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -19px 13px;padding:0 19px}.filter-row::-webkit-scrollbar{display:none}.filter{padding:9px 13px;font-size:10px}.search-row{gap:10px;flex-wrap:wrap;padding-bottom:14px}.search-wrap{flex:1 1 65%}.search-wrap input{font-size:11px}.sort-wrap{font-size:9px}.result-count{display:none}.paper{grid-template-columns:1fr;gap:19px;padding:25px 0 28px}.paper-visual{width:100%}.paper h3{font-size:20px}.authors{font-size:11px;line-height:1.7}.summary{font-size:12px}.paper-meta{margin-bottom:9px}.paper-links{gap:23px;font-size:11px}.paper-links a,.cite-button{font-size:11px}.demo-caption{font-size:9px}.demo-button{max-height:320px}.paper-tags{margin:0 0 11px}.about{padding:41px 0}.about-grid{grid-template-columns:1fr;gap:15px;margin-top:24px}.contact-band{display:block;padding:23px 0}.contact-band p{font-size:23px;margin-bottom:17px}.contact-band a{justify-content:space-between}.footer{font-size:9px;align-items:center}.footer>span{max-width:150px;text-align:right;line-height:1.6}.dialog-head{padding:18px 17px 14px}.dialog-head h2{font-size:14px}.dialog-body{padding:0 17px 18px}.dialog-note{font-size:11px}}
@media(max-width:380px){.hero h1{font-size:40px}.chinese-name{font-size:17px;margin-left:8px}.brand>span:last-child{display:none}.research-link{grid-template-columns:1fr 132px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
@media print{body{background:white}.wrap{width:100%}.site-header,.research-panel,.filter-row,.search-row,.motion-toggle,.paper-links,.demo-caption,.contact-band,.footer,.toast{display:none}.hero{padding:20px 0;gap:20px}.hero h1{font-size:40px}.hero-statement{font-size:22px}.publications{padding-top:25px}.paper{break-inside:avoid;grid-template-columns:220px 1fr;gap:20px}.paper h3{font-size:16px}.paper-visual img{content:var(--poster)}.about{break-inside:avoid}}


.hero{align-items:center;padding:57px 0 54px}
.hero-profile{align-self:center}
.research-triptych{margin-top:26px}
.experience strong{font-weight:600;color:var(--ink)}
.demo-caption{justify-content:flex-end}
.paper-tags{gap:5px 12px;margin:0 0 13px}
.paper-tags span{font-size:10px;line-height:1.65;color:#64765e}
.paper-tags span+span::before{content:none}
.about-side .service{margin-top:0}
.academic-section{padding:57px 0 0}
.section-kicker{font-size:11px;letter-spacing:.045em;color:var(--muted)}
.dated-list{border-top:1px solid var(--line)}
.dated-item{display:grid;grid-template-columns:165px minmax(0,1fr);gap:28px;padding:23px 0;border-bottom:1px solid var(--line)}
.dated-item time{font-size:12px;color:var(--muted);padding-top:3px}
.dated-item h3{font-size:18px;font-weight:500;line-height:1.5;letter-spacing:-.2px;margin:0 0 7px}
.dated-item p{font-size:12px;color:var(--muted);line-height:1.7;margin:0}
.dated-item a{border-bottom:1px solid #c1ceba}
.teaching-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}
.course{border-top:2px solid #b4c5a5;padding:20px 0 0}
.course-meta{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;font-size:10px;color:var(--muted);line-height:1.6;margin-bottom:15px}
.course h3{font-family:var(--serif);font-size:23px;font-weight:400;letter-spacing:-.4px;line-height:1.35;margin:0 0 16px}
.course p{font-size:11px;line-height:1.8;color:var(--muted);margin:0}
.course .instructor{color:#3e594c;margin-top:7px}
.outside{display:grid;grid-template-columns:280px minmax(0,1fr);gap:60px;background:#edf1e6;padding:38px 40px;border-radius:14px;margin:0 0 55px;overflow:hidden}
.outside .eyebrow{font-size:10px;margin-bottom:15px;color:var(--muted)}
.outside h2{font-family:var(--serif);font-size:42px;font-weight:400;letter-spacing:-1.2px;line-height:1.14;margin:0}
.outside h2 em{font-weight:400;color:var(--green)}
.river-line{color:#78986b;width:225px;height:80px;margin:10px 0 -20px}
.outside-copy{align-self:center}
.outside-copy p{font-size:14px;color:#536258;line-height:1.9;margin:0 0 14px}
.outside-copy a{color:var(--green);border-bottom:1px solid #9bb18c}
.hobby-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.hobby-list span{font-size:10px;color:#46633b;border:1px solid #cdd9c1;padding:6px 10px;border-radius:20px}
@media(max-width:960px){
 .nav{gap:21px;font-size:12px}
 .nav-contact{display:none!important}
 .hero{gap:38px}
 .outside{grid-template-columns:210px minmax(0,1fr);gap:30px;padding:32px}
 .outside h2{font-size:36px}
 .teaching-grid{gap:22px}
 .course h3{font-size:21px}
 .course-meta{display:block;min-height:32px}
 .course-meta span{display:block}
}
@media(max-width:700px){
 .site-header{height:auto;min-height:78px;padding:19px 0 16px;gap:14px;align-items:flex-start;flex-direction:column}
 .brand{font-size:13px}
 .nav{width:100%;gap:0;justify-content:space-between;font-size:11px}
 .nav a{padding:3px 0}
 .hero{padding:36px 0;gap:27px}
 .hero h1{font-size:49px}
 .hero-profile{align-self:stretch}
 .research-triptych{margin-top:21px}
 .paper-tags span{font-size:10px}
 .academic-section{padding-top:40px}
 .academic-section .section-heading{align-items:baseline;flex-wrap:wrap;gap:10px;margin-bottom:21px}
 .academic-section h2{font-size:33px}
 .section-kicker{font-size:10px}
 .dated-item{grid-template-columns:1fr;gap:9px;padding:20px 0}
 .dated-item time{font-size:10px;padding:0}
 .dated-item h3{font-size:17px;line-height:1.5}
 .dated-item p{font-size:11px}
 .teaching-grid{grid-template-columns:1fr;gap:23px}
 .course{padding-top:15px}
 .course-meta{display:flex;min-height:0;margin-bottom:10px}
 .course h3{font-size:23px;margin-bottom:10px}
 .about{padding:42px 0 28px}
 .outside{grid-template-columns:1fr;padding:26px 23px;gap:18px;margin-bottom:30px}
 .outside h2{font-size:34px}
 .outside h2 br{display:none}
 .outside h2 em::before{content:' '}
 .river-line{display:none}
 .outside-copy p{font-size:12px}
 .hobby-list{gap:7px;margin-top:19px}
 .hobby-list span{font-size:9px;padding:5px 9px}
}
@media print{.academic-section,.course,.dated-item,.outside{break-inside:avoid}.outside{background:none;border:1px solid #ddd}}

.author-legend{font-size:10px;line-height:1.7;color:var(--muted);margin:0 0 10px}.bibliography-link{font-size:11px;color:var(--green)}
@media(max-width:700px){.heading-main{flex-wrap:wrap}.bibliography-link{font-size:10px}}

.demo-button video{width:100%;height:100%;object-fit:contain;display:block;transition:transform .5s}.demo-button:hover video{transform:scale(1.025)}

 .demo-comparison{display:flex;flex-direction:column;justify-content:center;gap:14px;width:100%;height:100%;padding:14px;color:#edf3e8;text-align:left}.comparison-heading{display:block;font-size:11.5px;line-height:1.45;font-weight:700;color:#edf3e8}.comparison-heading::before{content:"";display:block;width:18px;height:1px;background:var(--lime);margin-bottom:10px}.comparison-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}.comparison-pane{display:flex;flex-direction:column;gap:8px;min-width:0}.comparison-label{font-size:9px;line-height:1.4;font-weight:600;color:var(--lime)}.demo-comparison video{width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;border-radius:5px;background:#071c16}.demo-button:hover .demo-comparison video{transform:none}.dialog-media.demo-comparison{height:auto;max-height:none;padding:26px;gap:24px}.dialog-media .comparison-heading{font-size:21px}.dialog-media .comparison-heading::before{width:34px;margin-bottom:16px}.dialog-media .comparison-label{font-size:13px}.dialog-media .comparison-grid{gap:18px}@media(max-width:700px){.dialog-media.demo-comparison{padding:16px;gap:18px}.dialog-media .comparison-label{font-size:10px}.dialog-media .comparison-heading{font-size:15px}}

.demo-framed{display:grid;grid-template-rows:auto minmax(0,1fr);gap:12px;width:100%;height:100%;padding:14px;color:#edf3e8;text-align:left}.grounded-window{position:relative;height:100%;aspect-ratio:720/403;max-width:100%;justify-self:center;overflow:hidden;border-radius:5px}.demo-framed .framed-image{position:absolute;left:0;top:-4.9628%;width:100%;height:111.6625%;object-fit:fill;transform:none}.demo-button:hover .demo-framed .framed-image{transform:none}.dialog-media.demo-framed{height:auto;aspect-ratio:8/5;max-height:59vh;padding:26px;gap:20px}.dialog-media.demo-framed .comparison-heading{font-size:21px}@media(max-width:700px){.dialog-media.demo-framed{padding:16px;gap:12px}.dialog-media.demo-framed .comparison-heading{font-size:13px}}

.demo-annotated{display:block;position:relative;container-type:inline-size;width:100%;height:100%;aspect-ratio:8/5;background:#112f2b}.demo-annotated img{display:block;width:100%;height:100%;object-fit:contain}.targo-caption{position:absolute;left:0;bottom:0;width:73%;height:12.45%;display:flex;align-items:center;padding-left:3.75%;background:#112f2b;color:#a9c0b3;font-size:2cqw;line-height:1;white-space:nowrap}.demo-button:hover .demo-annotated img{transform:none}.dialog-media.demo-annotated{width:min(100%,94.4vh);height:auto;aspect-ratio:8/5;margin-inline:auto}
