.product-demo{max-width:var(--content-max);padding:var(--space-24) var(--space-6);scroll-margin-top:var(--space-24);margin:0 auto}.product-demo .sr-only{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.demo-intro{justify-content:space-between;align-items:end;gap:var(--space-8);margin-bottom:var(--space-10);display:flex}.demo-intro>div{max-width:43rem}.demo-intro h1,.demo-intro h2{margin:var(--space-3) 0 var(--space-4);font-size:clamp(2rem,3.5vw,3.2rem)}.demo-intro p{color:var(--text-secondary);max-width:41rem}.demo-intro .button{flex-shrink:0}.demo-player{border:var(--line) solid var(--border-strong);border-radius:var(--radius-lg);background:var(--surface-card);box-shadow:var(--shadow-card);overflow:clip}.demo-chapters{border-bottom:var(--line) solid var(--border);padding:0 var(--space-4);grid-template-columns:repeat(6,minmax(0,1fr));display:grid}.demo-chapters button{justify-content:center;align-items:center;gap:var(--space-2);color:var(--text-secondary);padding:var(--space-5) var(--space-2);font-size:var(--font-sm);font-weight:var(--weight-bold);background:0 0;border:0;border-bottom:3px solid #0000;display:flex}.demo-chapters button[aria-pressed=true]{color:var(--brand-strong);background:var(--brand-soft);border-bottom-color:var(--brand)}.demo-chapters button:hover{background:var(--surface-hover)}.demo-chapter-number{color:var(--text-tertiary);font:var(--font-xs) var(--font-mono)}.demo-body{grid-template-columns:minmax(0,.85fr) minmax(0,2fr);display:grid}.demo-narration{padding:var(--space-8);gap:var(--space-5);background:var(--surface-hero);border-right:var(--line) solid var(--border);flex-direction:column;display:flex}.demo-step-label{font-size:var(--font-xs);font-weight:var(--weight-bold);color:var(--brand-strong);letter-spacing:var(--tracking-label)}.demo-narration h3{font-size:var(--font-xl);letter-spacing:var(--tracking-heading);line-height:1.2}.demo-narration>p{color:var(--text-secondary);font-size:var(--font-sm)}.demo-action-wrap{gap:var(--space-3);margin-top:auto;display:grid}.demo-action{padding:var(--space-3);white-space:normal;text-align:left;justify-content:start}.demo-action svg{flex-shrink:0}.demo-action-wrap small{color:var(--text-secondary);font-size:var(--font-xs)}.demo-step-navigation{align-items:center;gap:var(--space-3);font-size:var(--font-xs);color:var(--text-secondary);padding-top:var(--space-3);display:flex}.product-demo button:disabled{cursor:default}.demo-workspace{min-width:0}.demo-workspace-bar{gap:var(--space-2);padding:var(--space-4) var(--space-5);border-bottom:var(--line) solid var(--border);font-size:var(--font-xs);color:var(--text-secondary);align-items:center;display:flex}.demo-workspace-bar strong{font-weight:var(--weight-semibold);color:var(--text-primary)}.demo-workspace-bar img{border-radius:var(--radius-xs)}.demo-preview-label{color:var(--brand-strong);font-size:var(--font-micro);letter-spacing:var(--tracking-label);font-weight:var(--weight-heavy);margin-left:auto}.demo-project-top{padding:var(--space-6) var(--space-6) var(--space-5);justify-content:space-between;align-items:center;gap:var(--space-3);display:flex}.demo-project-top .eyebrow{font-size:var(--font-2xs);gap:var(--space-2);align-items:center;display:flex}.demo-project-top h4{font-size:var(--font-lg);letter-spacing:var(--tracking-heading);margin:var(--space-2) 0}.demo-location{align-items:center;gap:var(--space-1);color:var(--text-secondary);font-size:var(--font-xs);display:flex}.demo-project-tabs{padding:0 var(--space-6);gap:var(--space-5);border-bottom:var(--line) solid var(--border);display:flex}.demo-project-tabs button{align-items:center;gap:var(--space-2);font-size:var(--font-xs);font-weight:var(--weight-bold);padding:0 0 var(--space-3);color:var(--text-secondary);background:0 0;border:0;border-bottom:2px solid #0000;display:flex}.demo-project-tabs button[aria-pressed=true]{color:var(--brand-strong);border-bottom-color:var(--brand)}.demo-scene{padding:var(--space-6);min-height:21rem}.demo-capture-scene{gap:var(--space-5);grid-template-columns:1.35fr 1fr;display:grid}.demo-photo-frame{border-radius:var(--radius-sm);min-height:17rem;position:relative;overflow:hidden}.demo-photo-frame>img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.demo-image-caption{align-items:center;gap:var(--space-2);padding:var(--space-3);color:var(--text-inverse);background:var(--photo-overlay);font-size:var(--font-xs);display:flex;position:absolute;inset:auto 0 0}.demo-photo-saved{top:var(--space-3);left:var(--space-3);right:var(--space-3);justify-content:center;align-items:center;gap:var(--space-1);padding:var(--space-2);border-radius:var(--radius-xs);font-size:var(--font-2xs);color:var(--success);background:var(--success-soft);font-weight:var(--weight-bold);display:flex;position:absolute}.demo-photo-detail{align-content:start;gap:var(--space-4);display:grid}.demo-photo-count{align-items:center;gap:var(--space-2);font-size:var(--font-sm);flex-wrap:wrap;display:flex}.demo-photo-count>span{color:var(--text-secondary);font-size:var(--font-xs);flex-basis:100%}.demo-photo-detail p{font-size:var(--font-sm);color:var(--text-secondary)}.demo-add-photo{justify-items:center;gap:var(--space-3);text-align:center;padding:var(--space-5) var(--space-3);border:var(--line) dashed var(--brand-soft-border);background:var(--brand-soft);min-height:9rem;color:var(--brand-strong);border-radius:var(--radius-sm);display:grid}.demo-add-photo strong{font-size:var(--font-xs)}.demo-add-photo span{font-size:var(--font-2xs)}.demo-photo-detail textarea{font-size:var(--font-xs);min-height:8rem;padding:var(--space-3)}.demo-inline-hint{align-items:center;gap:var(--space-2);font-size:var(--font-xs);color:var(--text-secondary);display:flex}.demo-inline-hint svg{flex-shrink:0}.demo-annotation{border:3px solid var(--annotation-color);border-radius:var(--radius-xs);width:42%;height:40%;position:absolute;top:28%;left:16%}.demo-annotation span{width:max-content;max-width:12rem;padding:var(--space-1) var(--space-2);font-size:var(--font-2xs);background:var(--brand);color:var(--on-brand);font-weight:var(--weight-bold);position:absolute;top:100%;left:-3px}.demo-conversation-scene{gap:var(--space-4);display:grid}.demo-thread-item{align-items:start;gap:var(--space-3);display:flex}.demo-thread-item>div:last-child{flex:1}.demo-thread-item strong{gap:var(--space-2);font-size:var(--font-xs);flex-wrap:wrap;align-items:baseline;display:flex}.demo-thread-item small{font-weight:var(--weight-regular);font-size:var(--font-2xs);color:var(--text-secondary)}.demo-thread-item p{margin:var(--space-2) 0;font-size:var(--font-xs);color:var(--text-secondary);overflow-wrap:anywhere}.demo-thread-item.own{background:var(--brand-soft);border-radius:var(--radius-sm);padding:var(--space-3)}.demo-note-form{gap:var(--space-3);display:grid}.demo-note-form label,.demo-photo-detail label{font-size:var(--font-xs)}.demo-note-form textarea{min-height:4rem;font-size:var(--font-xs);padding:var(--space-3)}.demo-note-form .button{min-height:2.25rem;padding:var(--space-2) var(--space-3);font-size:var(--font-xs);justify-self:end}.demo-list-heading,.demo-gallery-heading{justify-content:space-between;align-items:center;gap:var(--space-3);margin-bottom:var(--space-5);display:flex}.demo-list-heading .eyebrow,.demo-gallery-heading .eyebrow{font-size:var(--font-2xs)}.demo-list-heading h4,.demo-gallery-heading h4{font-size:var(--font-md);margin-top:var(--space-2)}.demo-task-row{align-items:center;gap:var(--space-3);border-top:var(--line) solid var(--border);padding:var(--space-4) 0;display:flex}.demo-task-row input{width:var(--space-5);height:var(--space-5);accent-color:var(--brand);flex-shrink:0}.demo-task-row>div{flex:1}.demo-task-row strong{font-size:var(--font-xs);display:block}.demo-task-row small{color:var(--text-secondary);font-size:var(--font-2xs);font-weight:var(--weight-regular);margin-top:var(--space-1);display:block}.demo-task-row.complete strong{color:var(--text-secondary);text-decoration:line-through}.demo-check{color:var(--success);width:var(--space-5);height:var(--space-5);border:var(--line) solid var(--success);border-radius:var(--radius-xs);justify-content:center;align-items:center;display:flex}.demo-completion-note{align-items:center;gap:var(--space-4);padding:var(--space-4);margin-top:var(--space-4);border-radius:var(--radius-sm);background:var(--surface-muted);color:var(--text-secondary);display:flex}.demo-completion-note.ready{color:var(--success);background:var(--success-soft)}.demo-completion-note svg{flex-shrink:0}.demo-completion-note strong{font-size:var(--font-sm)}.demo-completion-note p{font-size:var(--font-xs);margin-top:var(--space-1)}.demo-report-heading{align-items:center;gap:var(--space-3);margin-bottom:var(--space-4);display:flex}.demo-report-heading h4{font-size:var(--font-sm)}.demo-report-heading>div>span{font-size:var(--font-xs);color:var(--text-secondary)}.demo-report-heading>.pill{margin-left:auto}.demo-document-icon{background:var(--brand-soft);color:var(--brand-strong);border-radius:var(--radius-sm);padding:var(--space-3);place-content:center;display:grid}.demo-report-start{text-align:center;padding:var(--space-5) var(--space-4);justify-items:center;gap:var(--space-3);background:var(--surface-muted);border-radius:var(--radius-sm);display:grid}.demo-report-start>svg{color:var(--brand-strong)}.demo-report-start p{color:var(--text-secondary);font-size:var(--font-xs);max-width:24rem}.demo-report-start .button{font-size:var(--font-xs);min-height:2.25rem;padding:var(--space-2) var(--space-3)}.demo-report-editor{font-size:var(--font-xs)}.demo-report-editor textarea{min-height:13rem;font-size:var(--font-xs);line-height:var(--leading-body);padding:var(--space-4)}.demo-report-disclosure{align-items:start;gap:var(--space-2);margin-top:var(--space-3);font-size:var(--font-2xs);color:var(--text-secondary);display:flex}.demo-report-disclosure svg{flex-shrink:0;margin-top:2px}.demo-gallery-photos{gap:var(--space-4);margin-bottom:var(--space-4);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.demo-gallery-photos figure{margin:0}.demo-gallery-photos img{object-fit:cover;border-radius:var(--radius-sm);width:100%;height:10rem}.demo-gallery-photos figcaption{font-size:var(--font-xs);padding-top:var(--space-2)}.demo-select-photo{cursor:pointer;font-size:var(--font-xs)}.demo-select-photo>span{align-items:center;gap:var(--space-2);display:flex}.demo-select-photo input{width:var(--space-4);height:var(--space-4);accent-color:var(--brand)}.demo-gallery-heading .text-button{font-size:var(--font-xs);flex-shrink:0}.demo-player-controls{gap:var(--space-5);border-top:var(--line) solid var(--border);padding:var(--space-3) var(--space-5);align-items:center;display:flex}.demo-play-button{gap:var(--space-2);padding:var(--space-2) 0;font-size:var(--font-xs);font-weight:var(--weight-bold);color:var(--text-primary);background:0 0;border:0;align-items:center;min-width:9rem;display:flex}.demo-play-button>svg{color:var(--brand-strong)}.demo-progress{border-radius:var(--radius-full);background:var(--surface-muted);flex:1;height:4px;overflow:hidden}.demo-progress>span{width:var(--demo-progress,0%);background:var(--brand);height:100%;transition:width var(--duration-normal);display:block}.demo-time{font:var(--font-2xs) var(--font-mono);white-space:nowrap;color:var(--text-secondary)}.demo-under-player{justify-content:space-between;align-items:center;gap:var(--space-4);margin-top:var(--space-5);display:flex}.demo-under-player>span{align-items:center;gap:var(--space-2);font-size:var(--font-xs);color:var(--text-secondary);display:flex}.demo-under-player .text-link{font-size:var(--font-xs)}.demo-next-step{align-items:center;gap:var(--space-12);margin-top:var(--space-20);padding:var(--space-10);border:var(--line) solid var(--brand-soft-border);background:var(--brand-soft);border-radius:var(--radius-lg);display:flex}.demo-next-step h2{font-size:var(--font-2xl);margin:var(--space-3) 0 var(--space-4)}.demo-next-step p{color:var(--text-secondary);font-size:var(--font-sm)}.demo-next-step>div:first-child{flex:1}.demo-next-step>div:last-child{gap:var(--space-3);display:grid}@media (max-width:1050px){.demo-intro{align-items:start;gap:var(--space-5);flex-direction:column}.demo-body{grid-template-columns:minmax(0,.85fr) minmax(0,1.5fr)}.demo-narration{padding:var(--space-6)}.demo-chapter-number{display:none}.demo-project-tabs{gap:var(--space-4)}.demo-project-tabs svg,.demo-workspace-bar>strong,.demo-workspace-bar>svg{display:none}.demo-capture-scene{grid-template-columns:1fr}.demo-photo-frame{min-height:14rem}.demo-photo-detail{grid-template-columns:1fr 1fr}.demo-photo-detail>p,.demo-photo-count>span{display:none}.demo-photo-detail .demo-add-photo,.demo-photo-detail label,.demo-photo-detail .demo-inline-hint{grid-column:1/-1}.demo-add-photo{text-align:left;min-height:auto;padding:var(--space-3);display:flex}.demo-add-photo span{margin-left:auto}.demo-photo-detail textarea{min-height:4rem}.demo-next-step{gap:var(--space-6);flex-direction:column;align-items:stretch}}@media (max-width:720px){.product-demo{padding:var(--space-12) var(--space-4)}.demo-intro{margin-bottom:var(--space-6)}.demo-intro p{font-size:var(--font-sm)}.demo-chapters{grid-template-columns:repeat(3,minmax(0,1fr));padding:0}.demo-chapters button{padding:var(--space-3) var(--space-2);font-size:var(--font-xs)}.demo-player{flex-direction:column;display:flex}.demo-chapters{order:0}.demo-body{flex-direction:column;order:2;display:flex}.demo-narration{gap:var(--space-3);border-right:0;border-bottom:var(--line) solid var(--border);padding:var(--space-5)}.demo-narration h3{font-size:var(--font-lg)}.demo-narration>p{font-size:var(--font-xs)}.demo-narration>p,.demo-step-label,.demo-action-wrap small{display:none}.demo-action-wrap{margin-top:var(--space-2)}.demo-action{justify-content:center}.demo-action-wrap small{text-align:center}.demo-step-navigation{display:none}.demo-workspace{scroll-margin-top:calc(var(--space-20) + var(--space-16))}.demo-workspace-bar{display:none}.demo-project-top{padding:var(--space-3) var(--space-4)}.demo-project-top .eyebrow,.demo-project-top .demo-location{display:none}.demo-project-top h4{font-size:var(--font-md)}.demo-project-top .pill{font-size:var(--font-micro)}.demo-location{font-size:var(--font-2xs)}.demo-project-tabs{padding:0 var(--space-4);gap:var(--space-3);justify-content:space-between}.demo-project-tabs button{font-size:var(--font-micro)}.demo-scene{padding:var(--space-4);min-height:20rem}.demo-capture-scene{gap:var(--space-4)}.demo-photo-frame{min-height:15rem}.demo-gallery-photos img{height:9rem}.demo-list-heading{gap:var(--space-2)}.demo-list-heading h4,.demo-gallery-heading h4{font-size:var(--font-sm)}.demo-player-controls{gap:var(--space-3);padding:var(--space-2) var(--space-4);border-top:0;border-bottom:var(--line) solid var(--border);top:var(--space-20);z-index:2;background:var(--surface-card);order:1;position:sticky}.demo-play-button{min-width:0;min-height:var(--button-height);font-size:var(--font-2xs)}.demo-under-player{flex-direction:column;align-items:start}.demo-next-step{padding:var(--space-6);margin-top:var(--space-12)}.demo-next-step h2{font-size:var(--font-xl)}.demo-next-step .button{font-size:var(--font-sm);white-space:normal}}