@import "https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600&family=Open+Sans:wght@400;500;600;700&display=swap";:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--paper:#f3ebdd;--ink:#2f1f0e;--muted:#796247;--line:#d7a64a40;--accent:#2f1f0e;--gold:#d7a64a;--amber:#9b681d;--rose:#ad5144;--serif:"Cormorant Garamond",Georgia,serif;color:var(--ink);background:var(--paper);font:14px/1.7 Open Sans,Arial,sans-serif}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0}button,input{font:inherit}button,a,input{touch-action:manipulation}a{color:inherit;text-underline-offset:5px}button{cursor:pointer}button:disabled{cursor:default;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--amber);outline-offset:5px}.skip{z-index:9;background:var(--ink);color:var(--paper);padding:12px;position:absolute;top:-80px;left:24px}.skip:focus{top:12px}.topbar,main,footer{width:min(1180px,100% - 80px);margin:auto}.topbar{border-bottom:1px solid var(--line);justify-content:space-between;gap:20px;padding:30px 0;font-size:12px;display:flex}.topbar a{text-decoration:none}.intro{grid-template-columns:1fr 1fr;align-items:end;column-gap:48px;padding:52px 0 40px;display:grid}.eyebrow{letter-spacing:.19em;text-transform:uppercase;color:var(--muted);margin:0 0 18px;font-size:10px}.intro>.eyebrow{grid-column:1/-1}.intro h1{font:500 clamp(48px,6vw,76px)/.98 var(--serif);letter-spacing:-.03em;margin:0}.intro h1 span{color:var(--muted)}.lede{color:var(--muted);margin:0 0 2px;font-size:16px;line-height:1.9}.demo-layout{grid-template-columns:minmax(0,1.35fr) minmax(300px,1fr);gap:40px;display:grid}.preview{aspect-ratio:4/3;background:var(--ink);min-width:0;color:var(--paper);border-radius:4px;align-self:start;position:relative;overflow:hidden}.preview-top{z-index:2;letter-spacing:.03em;background:linear-gradient(#20170fd9,#0000);justify-content:space-between;gap:12px;padding:18px 20px;font-size:10px;display:flex;position:absolute;top:0;left:0;right:0}.private-label{color:#d5c5ae}.preview video,.preview canvas{object-fit:contain;width:100%;height:100%;display:block;position:absolute;inset:0;transform:scaleX(-1)}.preview canvas{z-index:1}.placeholder{align-content:center;justify-items:center;padding:24px;display:grid;position:absolute;inset:0}.placeholder svg{stroke:#b5a68c;stroke-width:2px;width:min(90%,360px);max-height:75%}.placeholder .frame-corners{stroke:#d7a64a;stroke-width:3px}.placeholder p{color:#cabca7;text-align:center;margin:0;font-size:12px}.sample-label{z-index:3;text-align:center;background:#5c4b28;border-radius:3px;padding:6px 12px;font-size:10px;position:absolute;bottom:16px;left:16px;right:16px}.control-panel{min-width:0;position:relative}.control-panel>.eyebrow{margin-bottom:18px}.status-indicator{background:var(--muted);border-radius:50%;width:8px;height:8px;position:absolute;top:5px;right:0}.control-panel h2{font:500 36px/1.08 var(--serif);min-height:39px;margin:0 0 14px}.control-panel>p:not(.eyebrow){color:var(--muted);margin:0 0 24px;font-size:13px;line-height:1.8}.closure-metric{grid-template-columns:1fr auto;align-items:center;gap:12px;font-size:12px;display:grid}.closure-metric strong{font-variant-numeric:tabular-nums;font-size:20px;font-weight:600}.closure-metric small{color:var(--muted);font-size:12px;font-weight:400}.meter{background:#d7cbb6;border-radius:8px;grid-column:1/-1;height:4px;overflow:hidden}.meter span{background:var(--accent);width:0;height:100%;transition:width .1s linear;display:block}.metrics{grid-template-columns:repeat(3,1fr);gap:16px;margin:26px 0;display:grid}.metrics>div{border-bottom:1px solid var(--line);padding-bottom:14px}.metrics dt{color:var(--muted);font-size:10px}.metrics dd{font-variant-numeric:tabular-nums;margin:4px 0 0;font-size:22px}.actions{flex-wrap:wrap;gap:8px;display:flex}.primary,.secondary{border:1px solid var(--line);border-radius:4px;min-height:42px;padding:10px 15px;font-size:12px;line-height:1.5}.primary{background:var(--accent);color:var(--paper);border-color:var(--accent)}.primary:hover:not(:disabled){background:var(--gold);border-color:var(--gold);color:var(--ink)}.secondary{color:var(--ink);background:0 0}.secondary:hover:not(:disabled){border-color:var(--gold);background:#d7a64a18}.sound-control{color:var(--muted);align-items:center;gap:8px;margin:18px 0;font-size:11px;display:flex}.sound-control input{accent-color:var(--accent)}.control-panel p.session-note{margin:0;font-size:11px}.explanation{border-top:1px solid var(--line);grid-template-columns:1fr 1.6fr;gap:64px;margin-top:54px;padding:38px 0;display:grid}.explanation h2{font:500 38px/1.1 var(--serif);margin:0}.explanation>div>p:not(.eyebrow){color:var(--muted);margin:0 0 16px;font-size:13px}.explanation .research-note{font-size:12px}.help{border-block:1px solid var(--line);max-width:100%;margin-bottom:40px;padding:20px 0;font-size:12px}.help summary{cursor:pointer}.help p{max-width:760px;color:var(--muted)}footer{color:var(--muted);justify-content:space-between;gap:20px;padding:0 0 30px;font-size:10px;display:flex}body[data-status=prolonged] .status-indicator,body[data-status=prolonged] .meter span{background:var(--rose)}body[data-status=prolonged] #status-title{color:var(--rose)}body[data-status=open] .status-indicator{background:var(--accent)}body[data-status=closed] .status-indicator{background:var(--amber)}@media (width<=850px){.topbar,main,footer{width:calc(100% - 40px)}.intro{gap:20px;padding-top:36px}.intro h1{font-size:58px}.lede{font-size:14px}.demo-layout{grid-template-columns:1fr;gap:28px}.preview{aspect-ratio:4/3;max-height:480px}.control-panel h2{font-size:34px}.explanation{grid-template-columns:1fr;gap:24px;margin-top:38px}.explanation h2{font-size:34px}.metrics{margin:20px 0}.control-panel>p:not(.eyebrow){margin-bottom:18px}footer{flex-direction:column;gap:4px}}@media (width<=500px){.intro{grid-template-columns:1fr}.intro h1{font-size:54px}.lede{margin-top:8px}.topbar{font-size:10px}.preview-top{padding:14px;font-size:9px}.actions .primary{flex:1}.placeholder p{max-width:240px}.sample-label{font-size:9px}.control-panel h2{font-size:32px}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}