/* Presentation layer. Research equations and demo mechanics remain in their original sources. */
:root{
  --ink:#202a2a;
  --muted:#5d6866;
  --paper:#f8f8f4;
  --line:#d9dfd8;
  --accent:#215b48;
  --color-bg-primary:var(--paper);
  --color-bg-secondary:#eef1eb;
  --color-bg-tertiary:#e7ece5;
  --color-bg-card:#fff;
  --color-text-primary:var(--ink);
  --color-text-secondary:var(--muted);
  --color-text-muted:#66736a;
  --color-border:var(--line);
  --color-primary:var(--accent);
  --color-primary-light:#2f7057;
  --color-accent:var(--accent);
  --text-primary:var(--ink);
  --text-secondary:var(--muted);
  --bg-primary:var(--paper);
  --bg-secondary:#eef1eb;
  --border-color:var(--line)
}

html{
  scroll-padding-top:100px;
  background:var(--paper)
}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:Inter,Arial,sans-serif;
  line-height:1.65;
  -webkit-font-smoothing:antialiased
}
*{
  box-sizing:border-box
}
a{
  color:var(--accent)
}
a:hover{
  color:#123e2f
}
button,input{
  font:inherit
}
:focus-visible{
  outline:3px solid #3b795d;
  outline-offset:5px
}
::selection{
  background:#cddfbc;
  color:#1e3224
}
.skip-link{
  position:fixed;
  top:8px;
  left:16px;
  z-index:3000;
  transform:translateY(-160%);
  background:var(--ink);
  color:white;
  padding:10px 18px
}
.skip-link:focus{
  transform:none;
  color:white
}

.navbar,.navbar.scrolled,body:has(.demo-main) .navbar.scrolled{
  height:84px;
  background:var(--paper);
  border-bottom:1px solid var(--line);
  box-shadow:none;
  backdrop-filter:none;
  z-index:1000
}
.nav-container{
  width:min(1240px,calc(100% - 80px));
  max-width:1240px;
  height:84px;
  margin:auto;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:space-between
}
.nav-logo{
  display:flex;
  gap:12px;
  align-items:center;
  color:var(--ink);
  text-decoration:none
}

.logo-text{
  font-size:17px;
  font-weight:600;
  letter-spacing:-.5px;
  background:none;
  color:var(--ink);
  -webkit-text-fill-color:var(--ink)
}
.nav-links{
  gap:28px
}
.nav-link,.nav-link.active{
  font-size:13px;
  font-weight:500;
  color:var(--muted);
  padding:9px 0;
  border:0;
  border-radius:0;
  background:none
}
.nav-link:hover,.nav-link.active{
  color:var(--accent)
}
.nav-link.active{
  box-shadow:0 1px var(--accent)
}
.nav-link::after{
  display:none
}
.nav-cta{
  padding:10px 16px!important;
  border:1px solid var(--line)!important;
  color:var(--ink)!important
}
.nav-toggle span{
  background:var(--ink)
}

.lab-wrap{
  width:min(1240px,calc(100% - 80px));
  margin:auto
}
.lab-eyebrow{
  font:500 11px/1.5 'JetBrains Mono',monospace;
  text-transform:uppercase;
  letter-spacing:1.7px;
  color:var(--accent);
  margin:0 0 25px
}
.lab-hero{
  padding:162px 0 88px
}
.lab-hero-grid{
  display:grid;
  grid-template-columns:1fr 1.02fr;
  gap:64px;
  align-items:center
}
.lab-hero h1,.lab-page-head h1{
  font:400 clamp(46px,4.4vw,68px)/1.08 Georgia,serif;
  letter-spacing:-2.6px;
  color:var(--ink);
  margin:0 0 28px
}
.lab-hero h1 em{
  color:var(--accent);
  font-weight:400
}
.lab-intro{
  font-size:17px;
  color:var(--muted);
  line-height:1.8;
  max-width:510px;
  margin:0 0 30px
}
.lab-actions{
  display:flex;
  gap:20px;
  align-items:center;
  flex-wrap:wrap
}
.lab-button,.btn.btn-primary,.download-btn.primary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:25px;
  padding:13px 20px;
  background:var(--accent);
  border:1px solid var(--accent);
  border-radius:3px;
  color:white;
  font-size:13px;
  font-weight:500;
  text-decoration:none;
  box-shadow:none
}
.lab-button:hover,.btn.btn-primary:hover{
  background:#153f31;
  color:white;
  transform:none
}
.lab-text-link{
  font-size:13px;
  font-weight:500;
  text-decoration:none;
  border-bottom:1px solid #aabaae;
  padding:8px 0
}
.lab-text-link span{
  margin-left:20px
}
.lab-visual{
  margin:0;
  border:1px solid var(--line);
  background:#eef1eb
}
.lab-visual-top{
  font:10px 'JetBrains Mono',monospace;
  display:flex;
  justify-content:space-between;
  padding:15px 18px;
  color:#5a6b5c;
  border-bottom:1px solid var(--line)
}
.lab-frame-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:var(--line)
}
.lab-frame-grid figure{
  margin:0;
  min-width:0;
  background:#f4f4f0
}
.lab-frame-grid img{
  display:block;
  width:100%;
  aspect-ratio:1;
  object-fit:cover
}
.lab-frame-grid figcaption{
  font:9px 'JetBrains Mono',monospace;
  color:var(--muted);
  padding:13px 6px;
  text-align:center
}
.lab-visual>figcaption{
  font-size:11px;
  color:var(--muted);
  padding:18px;
  line-height:1.65
}
.lab-visual>figcaption strong{
  display:block;
  color:var(--ink);
  font-weight:500;
  margin-bottom:4px
}

.lab-index{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border-block:1px solid var(--line);
  padding:26px 0;
  gap:32px
}
.lab-index div{
  display:flex;
  align-items:center;
  gap:18px
}
.lab-index strong{
  font:400 30px Georgia,serif
}
.lab-index span{
  font-size:11px;
  line-height:1.7;
  color:var(--muted);
  max-width:170px
}
.lab-section{
  padding:82px 0;
  border-bottom:1px solid var(--line)
}
.lab-section-head{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px;
  margin-bottom:40px
}
.lab-section h2,.lab-contact-strip h2{
  font:400 38px/1.2 Georgia,serif;
  letter-spacing:-1px;
  margin:0
}
.lab-section-head>p{
  font-size:14px;
  color:var(--muted);
  align-self:end;
  margin:0;
  max-width:480px
}
.lab-research-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:34px
}
.lab-research-item{
  padding-top:23px;
  border-top:1px solid #9bae9e
}
.lab-number{
  font:11px 'JetBrains Mono',monospace;
  color:#5f7764
}
.lab-research-item h3{
  font-size:18px;
  font-weight:500;
  letter-spacing:-.4px;
  line-height:1.4;
  margin:25px 0 14px
}
.lab-research-item p{
  font-size:13px;
  color:var(--muted);
  margin:0
}
.lab-featured{
  display:grid;
  grid-template-columns:1fr 1fr;
  border:1px solid var(--line)
}
.lab-featured-image{
  background:white;
  min-height:280px;
  display:flex;
  align-items:center;
  padding:28px;
  border-right:1px solid var(--line)
}
.lab-featured-image img{
  display:block;
  width:100%
}
.lab-featured-copy{
  padding:42px;
  display:flex;
  align-items:start;
  flex-direction:column;
  justify-content:center
}
.lab-featured-copy h3{
  font:400 30px/1.25 Georgia,serif;
  margin:0 0 18px;
  letter-spacing:-.6px
}
.lab-featured-copy p{
  font-size:13px;
  color:var(--muted);
  margin:0 0 22px
}
.lab-note{
  font-size:11px;
  color:var(--muted);
  margin-top:18px;
  max-width:900px
}
.lab-support{
  display:grid;
  grid-template-columns:1fr 2fr;
  gap:64px
}
.lab-support h2{
  font-size:30px
}
.lab-support p{
  font-size:14px;
  color:var(--muted);
  max-width:690px;
  margin:0 0 18px
}
.lab-credit-names{
  font-size:13px;
  color:var(--ink);
  display:flex;
  gap:28px;
  flex-wrap:wrap;
  margin-top:26px
}
.lab-contact-strip{
  display:flex;
  justify-content:space-between;
  gap:40px;
  align-items:center;
  padding:58px 0
}
.lab-contact-strip p{
  font-size:14px;
  color:var(--muted);
  margin:15px 0 0
}

.lab-footer{
  border-top:1px solid var(--line);
  padding:42px 0 22px;
  background:#eff2eb
}
.lab-footer-top{
  display:flex;
  justify-content:space-between;
  gap:40px;
  padding-bottom:35px
}
.lab-footer-brand{
  font-size:15px;
  font-weight:500
}
.lab-footer-brand p{
  font-size:12px;
  max-width:290px;
  font-weight:400;
  color:var(--muted);
  margin-top:10px
}
.lab-footer-links{
  display:flex;
  gap:27px;
  align-items:start;
  font-size:12px
}
.lab-footer-links a{
  text-decoration:none;
  color:var(--ink)
}
.lab-footer-bottom{
  border-top:1px solid var(--line);
  padding-top:20px;
  display:flex;
  justify-content:space-between;
  gap:20px;
  color:var(--muted);
  font-size:10px
}
.lab-footer-bottom a{
  color:var(--muted);
  text-decoration:none;
  margin-left:20px
}
.lab-page-head{
  padding:157px 0 62px;
  max-width:850px
}
.lab-page-head h1{
  font-size:58px;
  max-width:760px
}
.lab-page-head .lab-intro{
  max-width:730px
}
.lab-split{
  display:grid;
  grid-template-columns:1fr 1.6fr;
  gap:110px
}
.lab-prose p{
  font-size:16px;
  color:var(--muted);
  margin:0 0 23px
}
.lab-timeline{
  list-style:none;
  margin:0;
  padding:0
}
.lab-timeline li{
  padding:25px 0;
  display:grid;
  grid-template-columns:130px 1fr;
  gap:30px;
  border-top:1px solid var(--line)
}
.lab-timeline time{
  font:11px 'JetBrains Mono',monospace;
  color:var(--accent);
  padding-top:5px
}
.lab-timeline h3{
  font-size:16px;
  font-weight:500;
  margin:0 0 8px
}
.lab-timeline p{
  font-size:13px;
  color:var(--muted);
  margin:0
}
.lab-person{
  display:grid;
  grid-template-columns:160px 1fr;
  gap:38px
}
.lab-person img{
  width:160px;
  height:190px;
  object-fit:cover;
  filter:grayscale(100%)
}
.lab-person h3{
  font-size:23px;
  font-weight:500;
  margin:0 0 3px
}
.lab-person p{
  font-size:14px;
  color:var(--muted);
  margin:20px 0 0
}
.lab-person .lab-role{
  font:11px 'JetBrains Mono',monospace;
  margin:0;
  color:var(--accent)
}
.lab-contact-card{
  border-block:1px solid var(--line);
  padding:36px 0;
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:50px
}
.lab-mail{
  font:clamp(23px,3vw,38px) Georgia,serif;
  letter-spacing:-.7px;
  text-decoration:none;
  overflow-wrap:anywhere
}
.lab-contact-card p{
  font-size:14px;
  color:var(--muted)
}

.paper-hero,.validation-hero,.legal-hero{
  background:var(--paper)!important;
  border-bottom:1px solid var(--line);
  padding:152px 32px 54px;
  text-align:center
}
.paper-badge,.validation-badge{
  background:none;
  border:0;
  color:var(--accent);
  font:11px 'JetBrains Mono',monospace;
  letter-spacing:1.3px;
  text-transform:uppercase;
  padding:0
}
.paper-title,.validation-title,.legal-hero h1{
  font:400 clamp(36px,4vw,58px)/1.12 Georgia,serif;
  letter-spacing:-1.5px;
  background:none!important;
  -webkit-text-fill-color:var(--ink);
  color:var(--ink);
  margin:24px 0 18px
}
.paper-subtitle,.validation-subtitle{
  font-size:16px;
  max-width:760px;
  color:var(--muted)
}
.paper-meta{
  font-size:12px;
  color:var(--muted)
}
.paper-meta .meta-divider{
  color:var(--muted)
}
.paper-content{
  background:var(--paper);
  padding-top:40px
}
.paper-content .container-narrow{
  max-width:890px
}
.paper-toc{
  background:#eef1eb;
  border:1px solid var(--line);
  border-radius:0;
  padding:28px 35px
}
.paper-toc h3{
  font-size:15px;
  color:var(--ink)
}
.paper-toc a{
  color:var(--accent);
  font-size:13px
}
.paper-section h2{
  font:400 32px/1.3 Georgia,serif;
  color:var(--ink);
  border-bottom:1px solid var(--line);
  border-image:none;
  padding-bottom:20px
}
.paper-section h3{
  font:500 19px/1.5 Inter,Arial,sans-serif;
  color:var(--ink);
  margin-top:30px
}
.paper-section h4{
  color:var(--ink)
}
.paper-content .paper-section strong,.paper-content .paper-section em{
  color:inherit
}
.paper-content .paper-section h2::after{
  display:none
}
.paper-content .paper-section a{
  color:var(--accent);
  text-decoration:underline;
  text-underline-offset:3px
}
.paper-content .paper-section .btn-primary{
  color:#fff;
  text-decoration:none
}
.paper-section p,.paper-section li{
  color:var(--muted);
  line-height:1.85
}
.abstract-box,.insight-box,.equation-box,.roadmap-box,.results-highlight{
  background:#eef1eb!important;
  border:1px solid var(--line)!important;
  border-left:3px solid #8caa8b!important;
  border-radius:0;
  box-shadow:none;
  color:var(--ink)
}
.equation{
  color:var(--ink);
  overflow-x:auto
}
.equation-label,.figure-caption{
  color:var(--muted)
}
.equation-box{
  max-width:100%;
  overflow:auto
}
.algorithm-box,.code-figure,.api-spec{
  max-width:100%;
  overflow:auto;
  border-color:var(--line);
  border-radius:2px;
  background:#26352d;
  color:#eef4e9
}
.algorithm-content,.algorithm-header,.api-header,.api-content{
  background:transparent
}
.code-figure pre{
  background:#26352d
}
.paper-content .algorithm-box,.paper-content .code-figure,.paper-content .api-spec{
  color:#eef4e9
}
.paper-content :is(.algorithm-box,.code-figure,.api-spec) :is(p,li,code,strong,em,.figure-caption,.api-line,.api-header,.algorithm-header,.algorithm-line){
  color:inherit
}
.paper-content :is(.algorithm-box,.code-figure,.api-spec) a{
  color:#d6edbe
}
.paper-content .paper-section p>code,.paper-content .paper-section li>code{
  color:var(--ink);
  background:#e4eae0
}
.paper-content .data-table .tag{
  color:#34523b;
  background:#e2eadd
}
.data-table,.stats-table{
  width:100%;
  border-collapse:collapse;
  background:#fff;
  border:1px solid var(--line);
  font-size:12px;
  color:var(--ink)
}
.data-table th,.stats-table th{
  background:#eaf0e6;
  color:var(--ink);
  font-size:11px;
  text-transform:none
}
.data-table td,.data-table th,.stats-table td,.stats-table th{
  padding:14px 16px;
  border-bottom:1px solid var(--line)
}
.data-table td,.stats-table td{
  color:var(--muted)
}
.data-table tr:hover,.stats-table tr:hover,.data-table .highlight{
  background:#eff4eb
}
.paper-content .data-table tr.highlight{
  background:#eff4eb
}
.paper-content .data-table tr.highlight td{
  color:var(--ink)
}
.paper-content .metrics-row .metric-value{
  color:var(--accent);
  -webkit-text-fill-color:var(--accent)
}
.metric-value,.stat-value{
  background:none!important;
  -webkit-text-fill-color:var(--accent);
  color:var(--accent)
}
.metric-label,.stat-label{
  color:var(--muted)
}
.tag{
  border-radius:2px;
  background:#e2eadd;
  color:#34523b
}
.lab-report-note{
  background:#edf1e8;
  border-left:3px solid #759774;
  padding:20px 24px;
  font-size:13px;
  line-height:1.8;
  color:var(--muted);
  margin-bottom:38px
}
.paper-actions .btn-outline,.download-btn{
  border:1px solid var(--line);
  background:#fff;
  color:var(--accent);
  box-shadow:none;
  border-radius:3px
}
.validation-section{
  background:var(--paper)!important;
  padding:65px 0
}
.section-number{
  color:var(--accent);
  font:11px 'JetBrains Mono',monospace;
  background:none
}
.validation-section .section-title,.download-section .section-title{
  font:400 34px/1.3 Georgia,serif;
  color:var(--ink);
  letter-spacing:-.7px
}
.section-description{
  color:var(--muted)
}
.report-card,.methodology-card{
  background:#fff;
  border:1px solid var(--line);
  box-shadow:none;
  border-radius:2px;
  overflow:hidden
}
.report-card:hover,.methodology-card:hover{
  box-shadow:none;
  transform:none;
  border-color:#b0c1af
}
.report-image{
  background:#fff;
  padding:16px
}
.report-image img{
  object-fit:contain
}
.report-title,.methodology-title{
  color:var(--ink)
}
.report-description,.methodology-text{
  color:var(--muted)
}
.methodology-icon{
  background:#e8eee5;
  color:var(--accent);
  border-radius:2px
}
.honesty-box{
  background:#eef2e7;
  border:1px solid #cbd6bd;
  border-radius:2px
}
.honesty-title{
  color:var(--ink)
}
.honesty-list li{
  color:var(--muted)
}
.download-section{
  background:#eef1eb!important;
  border-top:1px solid var(--line)
}
.legal-content{
  max-width:850px;
  padding:52px 30px 70px
}
.legal-content h2{
  font:400 28px Georgia,serif;
  color:var(--ink)
}
.legal-content p,.legal-content li{
  color:var(--muted)
}
.legal-hero .last-updated{
  color:var(--muted);
  font-size:12px
}
.report-source{
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  font:14px/1.8 Inter,Arial,sans-serif;
  color:var(--muted)
}

.demo-header{
  display:block;
  padding:132px 0 26px;
  background:var(--paper)
}
.demo-header-content{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:35px
}
.demo-info{
  max-width:760px
}
.demo-info h1{
  font:400 43px/1.2 Georgia,serif;
  letter-spacing:-1.2px;
  color:var(--ink);
  margin-bottom:16px
}
.demo-info p{
  font-size:14px;
  line-height:1.8;
  color:var(--muted)
}
.server-status{
  font-size:12px;
  white-space:nowrap
}
.status-text{
  color:var(--muted)
}
.demo-main{
  padding:12px 20px 56px;
  min-height:0;
  background:var(--paper)
}
.demo-layout{
  padding-top:0;
  gap:22px;
  grid-template-columns:340px minmax(0,1fr)
}
.demo-main .container,.demo-header .container{
  max-width:1280px
}
.video-tutorial-banner{
  background:#edf1e8;
  border:1px solid var(--line);
  border-radius:2px
}
.video-toggle:hover{
  background:#e4eadf
}
.video-icon{
  background:var(--accent);
  border-radius:3px
}
.video-text{
  color:var(--ink)
}
.video-arrow{
  color:var(--muted)
}
.panel-section{
  background:#fff;
  border:1px solid var(--line);
  border-radius:2px;
  backdrop-filter:none
}
.panel-title{
  color:var(--muted);
  font-size:10px
}
.control-dot{
  box-shadow:none
}
.gender-btn,.reset-btn,.shuffle-btn,.coord-btn{
  background:#f7f8f4;
  border:1px solid var(--line);
  color:var(--ink);
  border-radius:3px;
  box-shadow:none
}
.gender-btn:hover,.reset-btn:hover,.shuffle-btn:hover,.coord-btn:hover{
  background:#e9eee3;
  color:var(--ink)
}
.gender-btn.active{
  background:#e4eedf;
  border-color:#99b394;
  color:#254c35
}
.joystick-pad{
  background:#f2f5ed;
  border-color:#cbd7c4;
  border-radius:3px
}
.joystick-grid{
  background-image:linear-gradient(#d7e1d2 1px,transparent 1px),linear-gradient(90deg,#d7e1d2 1px,transparent 1px)
}
.axis-label{
  color:#43533e;
  background:#f2f5ed;
  padding:1px 3px;
  border-radius:2px
}
.coord-input-group label{
  color:var(--muted)
}
.coord-input{
  color:var(--ink);
  background:#f8faf5;
  border-color:var(--line)
}
.expr-label{
  color:#655449
}
.expr-icon{
  font-size:9px;
  color:var(--muted);
  opacity:1
}
.expr-slider{
  background:#d9e2d0
}
.results-panel{
  border:1px solid var(--line);
  background:#fff;
  border-radius:2px;
  min-width:0
}
.results-header{
  background:#f1f4ed;
  border-bottom:1px solid var(--line);
  border-radius:0;
  padding:18px
}
.results-count,.results-time{
  color:var(--muted)
}
.results-count span{
  color:var(--ink)
}
.query-display{
  background:#e7eddf;
  border:1px solid #d5dfcb;
  border-radius:2px;
  color:#506046
}
.query-display code{
  color:#506046
}
.results-grid{
  background:#fff;
  gap:8px;
  padding:14px;
  grid-template-columns:repeat(4,minmax(0,1fr))
}
.result-card{
  border:1px solid var(--line);
  border-radius:2px;
  background:#eef1e9;
  box-shadow:none;
  overflow:hidden
}
.result-card:hover{
  box-shadow:none;
  border-color:#88a87d
}
.result-image{
  background:#f2f3ef
}
.result-info{
  background:#f2f4ec;
  color:var(--ink)
}
.result-name,.result-distance{
  color:#59674f
}
.results-placeholder h3{
  color:var(--ink)
}
.results-placeholder p{
  color:var(--muted)
}
.demo-btn{
  border-radius:3px;
  box-shadow:none
}
.hint{
  color:var(--muted)!important
}

@media(max-width:1050px){
  .lab-hero-grid{
  gap:38px
}
.lab-hero h1{
  font-size:52px
}
.lab-split{
  gap:50px
}
.lab-featured-copy{
  padding:30px
}
.demo-layout{
  grid-template-columns:300px minmax(0,1fr)
}
.joystick-wrapper{
  gap:9px
}
.panel-section{
  padding:14px
}
.joystick-pad{
  width:120px;
  height:120px
}
.results-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))
}
.nav-links{
  gap:20px
}

}

@media(max-width:768px){
  .navbar,.navbar.scrolled,.nav-container,body:has(.demo-main) .navbar.scrolled{
  height:72px
}
.nav-container,.lab-wrap{
  width:calc(100% - 40px)
}
.logo-text{
  font-size:16px
}
.nav-toggle{
  display:flex
}
.nav-links{
  position:fixed;
  display:none;
  top:72px;
  left:0;
  right:0;
  height:calc(100dvh - 72px);
  padding:35px 24px;
  background:var(--paper)!important;
  flex-direction:column;
  align-items:stretch;
  justify-content:start;
  gap:18px;
  border-top:1px solid var(--line)
}
.nav-links.active{
  display:flex
}
.nav-links .nav-link{
  font-size:21px;
  padding:10px 0;
  opacity:1;
  transform:none
}
.nav-cta{
  text-align:center
}
.lab-hero{
  padding:116px 0 42px
}
.lab-hero-grid{
  grid-template-columns:1fr;
  gap:42px
}
.lab-hero h1{
  font-size:49px;
  letter-spacing:-2px;
  max-width:500px
}
.lab-intro{
  font-size:15px
}
.lab-index{
  gap:18px;
  padding:23px 0
}
.lab-index div{
  display:block
}
.lab-index strong{
  font-size:26px;
  display:block
}
.lab-index span{
  font-size:10px;
  display:block;
  margin-top:7px
}
.lab-section{
  padding:48px 0
}
.lab-section-head,.lab-split,.lab-support{
  grid-template-columns:1fr;
  gap:24px
}
.lab-section-head{
  margin-bottom:30px
}
.lab-section h2,.lab-contact-strip h2{
  font-size:32px
}
.lab-research-grid{
  grid-template-columns:1fr;
  gap:30px
}
.lab-research-item h3{
  margin:15px 0 10px
}
.lab-featured{
  grid-template-columns:1fr
}
.lab-featured-image{
  border-right:0;
  border-bottom:1px solid var(--line);
  min-height:180px
}
.lab-featured-copy{
  padding:27px
}
.lab-featured-copy h3{
  font-size:28px
}
.lab-contact-strip{
  display:block;
  padding:42px 0
}
.lab-contact-strip .lab-button{
  margin-top:24px
}
.lab-footer-top{
  display:block
}
.lab-footer-links{
  margin-top:26px;
  gap:18px;
  flex-wrap:wrap
}
.lab-footer-bottom{
  flex-direction:column;
  gap:12px
}
.lab-footer-bottom a{
  margin-left:0;
  margin-right:20px
}
.lab-page-head{
  padding:123px 0 40px
}
.lab-page-head h1{
  font-size:43px;
  letter-spacing:-1.7px
}
.lab-timeline li{
  grid-template-columns:80px 1fr;
  gap:20px
}
.lab-person{
  grid-template-columns:100px 1fr;
  gap:22px
}
.lab-person img{
  width:100px;
  height:135px
}
.lab-person h3{
  font-size:21px
}
.lab-contact-card{
  grid-template-columns:1fr;
  gap:15px
}
.paper-hero,.validation-hero,.legal-hero{
  padding:120px 20px 40px
}
.paper-content .container-narrow{
  padding:0 20px
}
.paper-toc{
  padding:23px
}
.paper-section h2{
  font-size:27px
}
.data-table,.stats-table{
  display:block;
  overflow:auto;
  max-width:100%
}
.data-table td,.data-table th,.stats-table td,.stats-table th{
  min-width:100px;
  padding:12px
}
.validation-section{
  padding:40px 0
}
.grid-2{
  grid-template-columns:1fr
}
.legal-content{
  padding:35px 22px 50px
}
.demo-header{
  padding:110px 0 20px
}
.demo-header .container,.demo-main .container{
  padding:0
}
.demo-header .container{
  width:calc(100% - 40px)
}
.demo-info h1{
  font-size:34px
}
.demo-header-content{
  display:block
}
.server-status{
  margin-top:18px
}
.demo-layout{
  grid-template-columns:1fr;
  gap:20px
}
.controls-panel{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px
}
.controls-panel .panel-section:first-child,.controls-panel .panel-section:last-child,.controls-panel .panel-section:nth-child(4){
  grid-column:1/-1
}
.joystick-wrapper{
  flex-wrap:wrap;
  justify-content:center
}
.coord-inputs{
  width:100%;
  max-width:150px
}
.results-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:5px;
  padding:8px
}
.results-header{
  padding:12px
}
.results-info{
  flex-wrap:wrap;
  gap:10px
}
.query-display{
  overflow:auto;
  font-size:9px
}
.report-card .report-content{
  padding:22px
}
.lab-report-note{
  font-size:12px;
  padding:18px
}
.lab-frame-grid figcaption{
  font-size:8px;
  padding:11px 2px
}
.paper-actions,.metrics-row,.stats-row{
  flex-wrap:wrap
}
.validation-section .section-title{
  font-size:28px
}
.lab-visual-top{
  font-size:9px
}
.lab-prose p{
  font-size:15px
}

}

.nav-cta,.nav-cta:hover{
  box-shadow:none!important;
  background:none
}
.paper-toc{
  box-shadow:none;
  backdrop-filter:none
}
.paper-toc li a,.paper-toc li a::before,.paper-toc li a:hover{
  color:var(--accent);
  border-radius:0
}
.paper-toc li a:hover{
  background:#e2eadc
}
.metrics-row .metric,.metrics-row .metric:hover{
  background:#eef1e7;
  border:1px solid var(--line);
  border-radius:2px;
  box-shadow:none;
  transform:none
}
.metrics-row .metric-label{
  color:var(--muted)
}
.metrics-row .metric-value{
  font-weight:500;
  font-size:28px
}
.results-highlight h4{
  color:var(--ink)
}
.coord-input-group{
  background:#edf1e7;
  border:1px solid var(--line);
  border-radius:3px
}
.results-header{
  flex-wrap:wrap;
  gap:12px
}
.demo-btn,.demo-btn:hover{
  background:#e5eedf;
  color:var(--accent);
  border:1px solid #b1c3a9;
  box-shadow:none
}
.demo-btn.active{
  background:var(--accent);
  color:#fff
}
.results-time{
  background:#e5eedf;
  border-color:#c5d8bc;
  color:#3e6240
}
.expr-label{
  background:#efece1;
  color:#675946
}
.expr-slider::-webkit-slider-thumb{
  background:#756351;
  box-shadow:none
}
.expr-slider::-moz-range-thumb{
  background:#756351;
  box-shadow:none
}

@media(prefers-reduced-motion:reduce){
  html{
  scroll-behavior:auto
}
*,*::before,*::after{
  animation:none!important;
  transition:none!important
}

}

.validation-section .section-title,.download-section .section-title{
  background:none!important;
  -webkit-text-fill-color:var(--ink)!important;
  color:var(--ink)!important
}
.paper-hero::after{
  background:var(--line);
  height:1px
}

@media(max-width:768px){
  .navbar,.navbar.scrolled,body:has(.demo-main) .navbar.scrolled{
  background:var(--paper)!important;
  box-shadow:none!important;
  border-bottom:1px solid var(--line)!important
}
.nav-toggle span{
  background:var(--ink)!important
}
.nav-links,.nav-links.active{
  background:var(--paper)!important;
  box-shadow:none!important;
  backdrop-filter:none!important
}
.nav-links .nav-link,.nav-links .nav-link.active,.nav-links .nav-link:hover{
  color:var(--ink)!important;
  background:none!important
}
.nav-logo,.logo-text{
  color:var(--ink)!important;
  -webkit-text-fill-color:var(--ink)!important
}


}

body:has(.demo-main) .navbar, body:has(.demo-main) .navbar.scrolled {
  background: var(--paper) !important;
  box-shadow: none !important;
  border-bottom: 1px solid var(--line) !important;
}

@media (max-width: 768px) {
  .nav-links {
    display: none !important;
    top: 72px !important;
    height: calc(100dvh - 72px) !important;
    padding: 28px 24px !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    background: var(--paper) !important;
    transition: none !important;
  }
  .nav-links.active { display: flex !important; opacity: 1 !important; }
  .nav-links .nav-link { font-size: 21px !important; padding: 12px 0 !important; max-width: none; text-align: left; }
}

/* The original phoenix artwork is shared by navigation, footer and favicons. */
.nav-logo .logo-img, .lab-footer-logo img {
  width:40px;
  height:40px;
  object-fit:contain;
  flex-shrink:0;
  filter:none;
}
.lab-footer-logo {
  display:inline-flex;
  align-items:center;
  gap:12px;
  color:var(--ink);
  text-decoration:none;
}