.padded-demo{
  height:100%;
  padding:24px;
  overflow:auto;
  scrollbar-width:thin;
  scrollbar-color:#456078 #101d28
}
.metric-label{
  display:block;
  font:10px/1.6 var(--mono);
  letter-spacing:.09em;
  color:var(--subtle)
}
.demo-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  margin-bottom:22px
}
.demo-heading h3{
  font-size:22px;
  margin:7px 0 0;
  font-weight:500
}
.outline-tag{
  border:1px solid #a0c9e02b;
  color:#9cb3c4;
  white-space:nowrap;
  padding:6px 9px;
  border-radius:4px;
  font-size:10px
}
.demo-toolbar{
  height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 18px;
  gap:10px;
  border-bottom:1px solid var(--line)
}
.demo-toolbar>span{
  font:10px var(--mono);
  letter-spacing:.09em;
  color:var(--subtle)
}
.layer-controls{
  display:flex;
  gap:5px
}
.layer-controls button{
  background:transparent;
  border:1px solid #9ab6cc33;
  border-radius:4px;
  color:var(--muted);
  font-size:11px;
  padding:5px 9px;
  min-height:28px
}
.layer-controls button[aria-pressed=true]{
  background:#9ac9ed14;
  border-color:#9ac9ed66;
  color:#d4e8f6
}
.motion-demo{
  height:100%;
  display:grid;
  grid-template-rows:42px minmax(0,1fr) 78px 34px
}
.runner{
  position:relative;
  overflow:hidden;
  min-height:0;
  background:#142a3c
}
.runner-image{
  display:block;
  width:100%;
  height:100%;
  background:#132a3b
}
.runner-image>image{
  filter:brightness(.85) saturate(.7)
}
.runner-compact .runner-image>image{
  filter:brightness(.86) saturate(.75)
}
.pose-overlay{
  stroke:#dff3fe;
  stroke-width:3.5
}
.rear-bones{
  stroke:#a6c7d3;
  stroke-width:3;
  opacity:.85
}
.front-joint{
  fill:#d9f0ff;
  stroke:#31506a;
  stroke-width:2
}
.rear-joint{
  fill:#afcbd6;
  stroke:#31506a;
  stroke-width:2
}
.hide-skeleton .pose-overlay,.hide-angles .angle-overlay{
  display:none
}
.frame-badge{
  position:absolute;
  top:16px;
  left:16px;
  background:#0b1723db;
  border:1px solid #b4cee42b;
  border-radius:4px;
  color:#d2dfeb;
  font:10px/1.3 var(--mono);
  letter-spacing:.07em;
  padding:7px 9px;
  display:flex;
  align-items:center;
  gap:9px
}
.frame-caption{
  position:absolute;
  bottom:12px;
  left:16px;
  right:16px;
  display:flex;
  justify-content:space-between;
  gap:8px;
  color:#e1eaf0;
  font:10px var(--mono);
  text-shadow:0 1px 5px #000
}
.frame-caption span{
  color:#c2d1dc
}
.runner-compact .frame-badge,.runner-compact .frame-caption{
  display:none
}
.motion-bottom{
  padding:13px 20px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-top:1px solid var(--line);
  background:#111f2c;
  gap:15px
}
.motion-bottom strong{
  font-size:30px;
  font-weight:400;
  line-height:1.2;
  letter-spacing:-.04em
}
.motion-bottom strong small{
  color:var(--amber);
  display:inline-block;
  font-size:16px;
  line-height:1;
  margin-left:2px;
  vertical-align:super;
  letter-spacing:0
}
.motion-bottom p{
  font-size:12px;
  text-align:right;
  line-height:1.7;
  margin:0;
  color:#cad8e3
}
.motion-bottom p span{
  color:var(--subtle);
  font-size:11px
}
.gait-strip{
  display:flex;
  align-items:center;
  padding:0 20px;
  gap:12px;
  font:9px var(--mono);
  color:#849bab;
  border-top:1px solid var(--line)
}
.gait-strip i{
  height:1px;
  flex:1;
  background:#2d4558
}
.gait-strip strong{
  font-weight:400;
  color:var(--amber)
}
.training-demo{
  display:flex;
  flex-direction:column;
  gap:16px;
  padding:22px
}
.training-demo .demo-heading{
  margin-bottom:0
}
.training-summary{
  display:flex;
  gap:24px;
  min-height:0;
  flex:1 1 140px;
  max-height:170px
}
.training-thumb{
  width:36%;
  min-height:95px;
  border-radius:5px;
  border:1px solid var(--line);
  overflow:hidden
}
.training-thumb .runner{
  height:100%
}
.metrics-list{
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:12px
}
.metrics-list>div{
  display:grid;
  grid-template-columns:64px max-content;
  align-items:baseline;
  justify-content:start;
  column-gap:18px
}
.metrics-list>div>span{
  font-size:12px;
  color:var(--subtle)
}
.metrics-list strong{
  font-size:21px;
  font-weight:400;
  letter-spacing:-.02em;
  white-space:nowrap
}
.metrics-list small{
  font-size:10px;
  color:var(--subtle);
  font-weight:400
}
.chart-card{
  border:1px solid var(--line);
  border-radius:5px;
  background:#0b1722;
  padding:12px 13px 2px;
  flex:1 1 190px;
  min-height:160px;
  max-height:220px;
  display:flex;
  flex-direction:column
}
.chart-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px
}
.chart-head>span{
  font:9px var(--mono);
  color:var(--subtle)
}
.segmented{
  display:flex;
  align-items:center;
  gap:3px;
  background:#09152070;
  border:1px solid var(--line);
  border-radius:5px;
  padding:3px
}
.segmented button{
  border:0;
  color:var(--subtle);
  background:none;
  font-size:10px;
  padding:6px 10px;
  border-radius:3px;
  white-space:nowrap
}
.segmented button[aria-pressed=true]{
  color:#d1e5f4;
  background:#213749
}
.legend-dot{
  display:inline-block;
  height:5px;
  width:5px;
  border-radius:50%;
  margin-right:6px
}
.heart{
  background:#e69a9e
}
.pace{
  background:var(--blue)
}
.chart-content{
  min-height:0;
  flex:1
}
.data-chart{
  width:100%;
  height:100%;
  display:block;
  min-height:125px
}
.source-row{
  display:flex;
  align-items:center;
  gap:10px
}
.source-mark{
  color:var(--blue);
  font-size:24px
}
.source-row p{
  margin:0;
  flex:1;
  font-size:12px
}
.source-row p>span{
  color:var(--subtle)
}
.source-row .outline-tag{
  font-size:9px
}
.assistant-symbol{
  font-size:36px;
  color:var(--blue);
  font-weight:200
}
.context-row{
  display:flex;
  gap:7px;
  flex-wrap:wrap;
  margin-bottom:23px
}
.context-row span{
  font-size:10px;
  background:#18324770;
  border:1px solid #9ac9ed1c;
  border-radius:4px;
  padding:5px 8px;
  color:#b7cbd9
}
.chat-question{
  margin-left:40px;
  padding:12px 16px;
  background:#27485e70;
  border:1px solid #9ac9ed20;
  border-radius:9px 9px 0 9px;
  font-size:13px;
  line-height:1.5;
  margin-bottom:20px
}
.assistant-answer{
  padding:0 0 0 16px;
  border-left:1px solid #9ac9ed59
}
.answer-brand{
  display:flex;
  align-items:center;
  gap:10px;
  color:#d3e7f6;
  font-size:23px;
  letter-spacing:0
}
.answer-brand>span{
  font:9px var(--mono);
  letter-spacing:.13em;
  color:var(--subtle)
}
.assistant-answer p{
  font-size:13px;
  line-height:1.65;
  margin:13px 0 0;
  color:#c3d1dc
}
.assistant-answer strong{
  font-weight:500;
  color:#eef3f7
}
.answer-sources{
  font-size:10px;
  color:var(--muted);
  margin-top:15px;
  display:flex;
  align-items:center;
  gap:12px
}
.answer-sources>span{
  color:var(--subtle);
  font:9px var(--mono)
}
.assistant-prompt{
  margin-top:22px;
  padding-top:16px;
  border-top:1px solid var(--line)
}
.assistant-prompt>p{
  font-size:10px;
  color:var(--subtle);
  margin-bottom:10px
}
.assistant-prompt>div{
  display:flex;
  gap:8px;
  flex-wrap:wrap
}
.assistant-prompt button{
  font-size:11px;
  padding:8px 10px;
  background:transparent;
  border:1px solid #9ac9ed30;
  border-radius:4px;
  color:#b6d6ed
}
.assistant-prompt button:hover{
  background:#244156
}
.demo-footnote{
  color:var(--subtle);
  font-size:9px;
  margin:16px 0 0
}
.review-evidence{
  display:flex;
  gap:20px;
  min-height:100px;
  height:31%;
  max-height:165px;
  margin-bottom:20px
}
.evidence-thumb{
  width:40%;
  border-radius:5px;
  overflow:hidden;
  border:1px solid var(--line)
}
.evidence-thumb>.runner{
  height:100%
}
.review-evidence>div:last-child{
  display:flex;
  justify-content:center;
  flex-direction:column;
  flex:1
}
.review-evidence strong{
  font-size:17px;
  line-height:1.35;
  font-weight:500;
  margin:9px 0
}
.review-evidence p{
  font-size:11px;
  color:var(--subtle);
  margin:0;
  line-height:1.6
}
.finding{
  border:1px solid #9ac9ed30;
  background:#15273577;
  padding:17px;
  border-radius:5px
}
.finding-top{
  display:flex;
  align-items:center;
  gap:9px;
  font:9px/1.5 var(--mono);
  color:var(--subtle);
  flex-wrap:wrap
}
.finding-indicator{
  font-size:17px;
  color:var(--blue)
}
.finding-status{
  margin-left:auto;
  color:var(--amber);
  letter-spacing:0
}
.finding-text{
  font-size:13px;
  line-height:1.6;
  color:#ccdae4;
  margin:12px 0 16px
}
.finding-actions{
  display:flex;
  gap:7px
}
.finding-actions button,.finding-editor button{
  font-size:11px;
  padding:8px 11px;
  border:1px solid #9ac9ed30;
  background:none;
  border-radius:4px
}
.finding-actions button:first-child,.finding-editor button:first-child{
  background:var(--blue);
  color:#102332;
  border-color:transparent
}
.finding[data-status=accepted]{
  border-color:#9ec9b75e
}
.finding[data-status=accepted] .finding-status{
  color:var(--green)
}
.finding[data-status=hidden] .finding-text{
  opacity:.45;
  text-decoration:line-through
}
.finding[data-status=hidden] .finding-status{
  color:var(--subtle)
}
.finding-editor{
  padding-top:15px
}
.finding-editor label{
  font-size:11px;
  color:var(--muted)
}
.finding-editor textarea{
  resize:vertical;
  display:block;
  margin:10px 0;
  width:100%;
  padding:10px;
  border:1px solid #9ac9ed66;
  border-radius:4px;
  background:#0a1621;
  color:var(--ink);
  font-size:13px;
  line-height:1.6
}
.finding-editor>div{
  display:flex;
  gap:10px
}
.review-result{
  display:flex;
  align-items:center;
  gap:9px;
  margin:17px 0 0;
  font-size:10px;
  color:var(--subtle);
  line-height:1.5
}
.delivery-demo{
  height:100%;
  display:flex;
  align-items:center;
  gap:27px;
  padding:25px;
  background:radial-gradient(ellipse at 70% 60%,#2a4e6b66,transparent 65%);
  overflow:auto
}
.delivery-side{
  flex:1;
  min-width:0
}
.delivery-side h3{
  font-family:Georgia,serif;
  font-size:30px;
  font-weight:400;
  line-height:1.16;
  margin:17px 0 28px
}
.delivery-checks p{
  font-size:11px;
  color:#bdcdd9;
  white-space:nowrap;
  margin-bottom:13px
}
.delivery-checks p>span{
  color:var(--green);
  margin-right:10px
}
.delivery-button{
  font-size:10px;
  padding:11px 12px;
  gap:10px;
  margin-top:17px;
  white-space:nowrap
}
.delivery-caption{
  font-size:10px;
  line-height:1.7;
  color:var(--subtle);
  margin:13px 0 0
}
.phone{
  height:100%;
  max-height:600px;
  min-height:415px;
  aspect-ratio: .53;
  flex:0 0 auto;
  border:4px solid #405262;
  outline:1px solid #9ac9ed33;
  border-radius:28px;
  box-shadow:10px 20px 40px #0005;
  position:relative;
  background:#0d1b26;
  padding:26px 9px 15px;
  overflow:hidden
}
.phone-speaker{
  position:absolute;
  top:8px;
  left:50%;
  transform:translateX(-50%);
  width:43px;
  height:5px;
  background:#050c13;
  border-radius:6px
}
.phone-header{
  display:flex;
  align-items:center;
  gap:5px;
  padding:0 4px;
  font-size:10px
}
.phone-header .small-brand{
  font-size:20px;
  margin:0 4px 0 0
}
.phone-time{
  margin-left:auto;
  font:9px var(--mono);
  color:var(--subtle)
}
.phone-notification{
  display:flex;
  gap:5px;
  align-items:center;
  justify-content:center;
  font-size:8px;
  line-height:1.4;
  padding:9px 3px;
  margin:12px 0 8px;
  border-radius:4px;
  background:#9ac9ed0e;
  color:#94b0c4;
  transition:background .35s,color .35s
}
.phone-notification .status-dot{
  width:4px;
  height:4px;
  box-shadow:none
}
.phone-picture{
  height:33%;
  overflow:hidden;
  border-radius:5px;
  background:#1a3245
}
.phone-picture .runner{
  height:100%
}
.phone-copy{
  padding:12px 4px 0
}
.phone-copy .metric-label{
  font-size:7px
}
.phone-copy h4{
  font-size:14px;
  font-weight:500;
  margin:5px 0 8px
}
.phone-copy p{
  font-size:9px;
  line-height:1.6;
  color:#b8c9d5;
  margin:0
}
.phone-task{
  margin-top:10px;
  padding:10px;
  border:1px solid #9ac9ed20;
  background:#162c3d66;
  border-radius:4px
}
.phone-task>span{
  font:7px var(--mono);
  color:var(--blue)
}
.phone-task p{
  margin-top:5px;
  font-size:8px
}
.phone-saved{
  display:block;
  margin-top:10px;
  font-size:7px;
  color:var(--subtle)
}
.phone-home{
  position:absolute;
  bottom:7px;
  left:50%;
  transform:translateX(-50%);
  height:3px;
  width:65px;
  border-radius:4px;
  background:#7b8f9f
}
.is-delivered .phone-notification{
  background:#88bfa32c;
  color:#b8e1cb
}
.is-delivered .phone{
  border-color:#729eaa
}
.workspace-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  margin:0 0 27px;
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
  border-radius:5px;
  overflow:hidden
}
.workspace-stats>div{
  background:#122230;
  padding:14px 16px
}
.workspace-stats span{
  font-size:10px;
  color:var(--subtle)
}
.workspace-stats strong{
  display:block;
  font-weight:400;
  font-size:30px;
  line-height:1.2;
  margin-top:7px;
  color:#d5e9f6
}
.queue-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:12px
}
.queue-header h4{
  font-size:13px;
  font-weight:500;
  margin:0
}
.athlete-list{
  border-top:1px solid var(--line)
}
.athlete-row{
  display:flex;
  align-items:center;
  gap:12px;
  width:100%;
  text-align:left;
  background:none;
  border:0;
  border-bottom:1px solid var(--line);
  padding:15px 0
}
.athlete-row[hidden]{
  display:none
}
.athlete-row:hover,.athlete-row[aria-pressed=true]{
  background:#9ac9ed09
}
.avatar{
  width:33px;
  height:33px;
  flex-shrink:0;
  display:grid;
  place-items:center;
  border-radius:50%;
  font-size:10px;
  letter-spacing:.02em
}
.avatar-blue{
  background:#9ac9ed18;
  color:#aed4ef
}
.avatar-amber{
  background:#b68c571f;
  color:#d8b58a
}
.avatar-green{
  background:#8caf9a1c;
  color:#a8c8b6
}
.athlete-info{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:5px
}
.athlete-info strong{
  font-size:13px;
  font-weight:500
}
.athlete-info small{
  font-size:9px;
  color:var(--subtle);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}
.athlete-status{
  font-size:9px;
  color:var(--amber);
  white-space:nowrap
}
.athlete-status.published{
  color:var(--green)
}
.row-arrow{
  color:var(--subtle);
  font-size:14px
}
.athlete-detail{
  margin-top:20px;
  padding:15px;
  border:1px solid #9ac9ed25;
  background:#15293970;
  border-radius:5px;
  min-height:109px
}
.athlete-detail .metric-label{
  font-size:9px
}
.athlete-detail h4{
  font-size:14px;
  font-weight:500;
  margin:7px 0
}
.athlete-detail p{
  font-size:11px;
  color:var(--muted);
  line-height:1.6;
  margin:0
}
.workspace-bottom{
  font-size:10px;
  color:var(--subtle);
  margin-top:15px;
  display:flex;
  gap:9px;
  align-items:center
}
@media(min-width:960px) and (max-height:800px){
  .padded-demo{
    padding:17px
  }
  .demo-heading{
    margin-bottom:15px
  }
  .demo-heading h3{
    font-size:20px
  }
  .training-demo{
    gap:11px
  }
  .training-summary{
    flex-basis:100px;
    max-height:130px
  }
  .chart-card{
    min-height:150px;
    flex-basis:150px
  }
  .metrics-list{
    gap:8px
  }
  .context-row{
    margin-bottom:15px
  }
  .assistant-demo .chat-question{
    margin-bottom:14px
  }
  .assistant-answer p{
    font-size:12px;
    margin-top:10px;
    line-height:1.55
  }
  .assistant-prompt{
    margin-top:15px;
    padding-top:12px
  }
  .assistant-prompt>p{
    margin-bottom:8px
  }
  .demo-footnote{
    margin-top:10px
  }
  .review-evidence{
    margin-bottom:14px;
    max-height:125px
  }
  .finding{
    padding:13px
  }
  .finding-text{
    font-size:12px;
    margin:10px 0 13px
  }
  .review-result{
    margin-top:12px
  }
  .workspace-stats{
    margin-bottom:17px
  }
  .workspace-stats>div{
    padding:10px 13px
  }
  .workspace-stats strong{
    font-size:25px
  }
  .athlete-row{
    padding:11px 0
  }
  .athlete-detail{
    margin-top:13px;
    padding:12px;
    min-height:90px
  }
  .workspace-bottom{
    margin-top:11px
  }
  .delivery-demo{
    padding:18px;
    gap:15px
  }
  .phone{
    min-height:395px
  }
  .delivery-side h3{
    font-size:27px
  }
}
@media(min-width:960px) and (max-width:1200px){
  .demo-toolbar{
    padding-inline:12px
  }
  .demo-toolbar>span{
    font-size:8px
  }
  .padded-demo{
    padding:16px
  }
  .demo-heading h3{
    font-size:19px
  }
  .metrics-list strong{
    font-size:17px
  }
  .metrics-list small{
    font-size:8px
  }
  .metrics-list>div>span{
    font-size:10px
  }
  .training-summary{
    gap:14px
  }
  .chart-head>span{
    font-size:8px
  }
  .training-demo .outline-tag{
    font-size:8px
  }
  .review-evidence{
    gap:15px
  }
  .review-evidence strong{
    font-size:15px
  }
  .finding-top{
    font-size:8px
  }
  .finding-actions{
    gap:4px
  }
  .finding-actions button{
    padding:7px;
    font-size:10px
  }
  .delivery-demo{
    gap:12px;
    padding:16px
  }
  .delivery-side h3{
    font-size:25px
  }
  .delivery-button{
    padding:10px 8px;
    font-size:9px;
    gap:5px
  }
  .delivery-checks p{
    font-size:10px
  }
  .phone{
    min-height:365px;
    max-height:405px
  }
  .delivery-caption{
    font-size:9px
  }
  .athlete-row{
    gap:8px
  }
  .athlete-status{
    font-size:8px
  }
  .athlete-info strong{
    font-size:12px
  }
  .segmented button{
    padding:5px 7px
  }
}
@media(max-width:959px){
  .phone{
    max-height:490px
  }
  .delivery-demo{
    padding:35px 45px;
    gap:45px
  }
  .delivery-side h3{
    font-size:34px
  }
  .delivery-checks p{
    font-size:13px
  }
  .delivery-button{
    font-size:12px
  }
  .delivery-caption{
    font-size:12px
  }
  .assistant-answer p{
    font-size:15px
  }
  .chat-question{
    font-size:15px
  }
  .assistant-prompt button{
    font-size:12px
  }
  .athlete-info strong{
    font-size:15px
  }
  .athlete-info small{
    font-size:11px
  }
  .athlete-status{
    font-size:11px
  }
  .athlete-row{
    padding:18px 0
  }
  .athlete-detail p{
    font-size:13px
  }
  .finding-text{
    font-size:15px
  }
  .review-evidence strong{
    font-size:20px
  }
  .finding-actions button{
    font-size:13px
  }
}
@media(max-width:600px){
  .padded-demo{
    padding:18px
  }
  .demo-heading{
    gap:10px;
    margin-bottom:18px
  }
  .demo-heading h3{
    font-size:20px
  }
  .metric-label{
    font-size:9px
  }
  .outline-tag{
    font-size:9px;
    padding:5px 7px
  }
  .demo-toolbar{
    padding-inline:12px
  }
  .demo-toolbar>span{
    font-size:8px
  }
  .layer-controls button{
    padding:5px 7px;
    font-size:10px
  }
  .motion-demo{
    grid-template-rows:42px minmax(0,1fr) 83px 36px
  }
  .motion-demo>.runner .runner-image{
    height:100%;
    width:100%
  }
  .motion-bottom{
    padding:12px
  }
  .motion-bottom .metric-label{
    font-size:8px
  }
  .motion-bottom p{
    font-size:11px;
    max-width:140px
  }
  .motion-bottom p span{
    font-size:10px
  }
  .gait-strip{
    font-size:8px;
    padding:0 12px;
    gap:8px
  }
  .frame-badge{
    top:12px;
    left:12px;
    font-size:9px
  }
  .frame-caption{
    left:12px;
    right:12px;
    font-size:8px
  }
  .training-demo{
    gap:14px
  }
  .training-summary{
    gap:17px;
    max-height:155px
  }
  .metrics-list{
    gap:16px
  }
  .metrics-list>div{
    grid-template-columns:54px max-content;
    column-gap:12px
  }
  .metrics-list>div>span{
    font-size:11px
  }
  .metrics-list strong{
    font-size:17px
  }
  .metrics-list small{
    font-size:8px
  }
  .chart-card{
    padding:9px 10px 0;
    min-height:160px;
    flex-basis:170px
  }
  .chart-head>span{
    font-size:8px;
    max-width:80px;
    text-align:right;
    line-height:1.5
  }
  .segmented button{
    font-size:9px;
    padding:5px 8px
  }
  .source-row p{
    font-size:11px
  }
  .source-row .outline-tag{
    font-size:8px
  }
  .context-row{
    gap:5px;
    margin-bottom:18px
  }
  .context-row span{
    font-size:8px;
    padding:5px
  }
  .chat-question{
    font-size:12px;
    padding:11px 12px;
    margin-left:20px;
    margin-bottom:17px
  }
  .assistant-answer{
    padding-left:12px
  }
  .assistant-answer p{
    font-size:12px
  }
  .assistant-prompt{
    margin-top:19px
  }
  .assistant-prompt button{
    font-size:10px;
    padding:7px 8px
  }
  .answer-sources{
    font-size:9px;
    gap:8px
  }
  .demo-footnote{
    font-size:8px
  }
  .review-evidence{
    gap:15px
  }
  .review-evidence strong{
    font-size:16px
  }
  .review-evidence p{
    font-size:10px
  }
  .finding{
    padding:12px
  }
  .finding-top{
    font-size:8px;
    gap:5px
  }
  .finding-status{
    font-size:8px
  }
  .finding-text{
    font-size:12px
  }
  .finding-actions{
    gap:5px
  }
  .finding-actions button{
    font-size:10px;
    padding:8px 7px
  }
  .review-result{
    font-size:10px;
    align-items:flex-start
  }
  .review-result .status-dot{
    flex-shrink:0;
    margin-top:5px
  }
  .delivery-demo{
    padding:18px 12px;
    gap:10px
  }
  .delivery-side h3{
    font-size:20px;
    line-height:1.15;
    margin:14px 0 20px
  }
  .delivery-checks p{
    font-size:9px;
    white-space:normal;
    margin-bottom:11px;
    line-height:1.45
  }
  .delivery-checks p>span{
    margin-right:4px
  }
  .delivery-button{
    font-size:9px;
    white-space:normal;
    padding:9px 8px;
    gap:4px;
    line-height:1.5
  }
  .delivery-button span{
    font-size:13px
  }
  .delivery-caption{
    font-size:9px
  }
  .phone{
    min-height:350px;
    max-height:375px;
    min-width:0;
    border-width:3px;
    border-radius:24px;
    padding-inline:7px
  }
  .phone-header{
    font-size:9px;
    gap:3px
  }
  .phone-time{
    font-size:8px
  }
  .phone-header .small-brand{
    font-size:17px
  }
  .phone-notification{
    font-size:7px;
    margin:8px 0 6px;
    padding:7px 2px
  }
  .phone-copy{
    padding:7px 2px 0
  }
  .phone-copy h4{
    font-size:12px;
    margin:4px 0 6px
  }
  .phone-copy p{
    font-size:8px
  }
  .phone-task{
    padding:6px;
    margin-top:6px
  }
  .phone-task p{
    font-size:7px
  }
  .phone-saved{
    font-size:6px;
    margin-top:7px
  }
  .workspace-stats{
    margin-bottom:22px
  }
  .workspace-stats>div{
    padding:12px
  }
  .workspace-stats span{
    font-size:9px
  }
  .workspace-stats strong{
    font-size:27px
  }
  .queue-header h4{
    font-size:12px
  }
  .athlete-row{
    gap:8px;
    padding:14px 0
  }
  .athlete-info strong{
    font-size:12px
  }
  .athlete-info small{
    font-size:8px
  }
  .athlete-status{
    font-size:8px
  }
  .row-arrow{
    font-size:12px
  }
  .avatar{
    width:29px;
    height:29px;
    font-size:9px
  }
  .athlete-detail{
    margin-top:17px;
    padding:12px;
    min-height:105px
  }
  .athlete-detail p{
    font-size:11px
  }
  .workspace-bottom{
    font-size:9px
  }
  .workspace-demo .demo-heading h3{
    font-size:24px
  }
}
@media(max-width:360px){
  .delivery-demo{
    padding:14px 8px;
    gap:8px
  }
  .phone{
    max-height:360px;
    min-height:345px
  }
  .delivery-side h3{
    font-size:18px
  }
  .delivery-side .metric-label{
    font-size:8px
  }
  .window-bar .demo-label{
    font-size:7px
  }
  .padded-demo{
    padding:14px
  }
}