:root{color-scheme:light;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#263b32;background:#f6f5ef;font-synthesis:none}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-underline-offset:4px}button,select,input{font:inherit}button,a,select,input{touch-action:manipulation}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #b95b31;outline-offset:4px}header,main,footer{width:min(1200px,calc(100% - 64px));margin:auto}header{display:flex;align-items:center;justify-content:flex-end;border-bottom:1px solid #d8ddd3;padding:26px 0}nav{display:flex;gap:24px;font-size:13px}.intro{padding:46px 0 28px}.eyebrow{font-size:10px;letter-spacing:.16em;font-weight:700;color:#6b7d6e;margin:0 0 12px}h1{font-size:clamp(38px,5vw,62px);line-height:1.04;letter-spacing:-2.7px;margin:0 0 15px;font-weight:650}.intro>p:last-child{font-size:16px;color:#66756a;margin:0;line-height:1.6}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 294px;gap:20px}.stage{position:relative;background:#e3e9df;border:1px solid #d4ddcf;border-radius:16px;min-height:530px;overflow:hidden;display:flex;flex-direction:column}.stage-top,.stage-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;z-index:1;padding:22px}.pill{background:#f5f7ef;border:1px solid #c9d4c4;border-radius:24px;padding:7px 11px;font-size:9px;letter-spacing:.1em;font-weight:750}.pill[data-active=true]{background:#274c3b;color:#f3f6ed;border-color:#274c3b}.stage-label{font-size:9px;letter-spacing:.1em;color:#748471}.stage-bottom{margin-top:auto;font-size:10px;color:#63745f;padding-top:14px}.text-button{background:none!important;border:none!important;box-shadow:none!important;font-size:11px;padding:3px!important;white-space:nowrap}#viewer{position:absolute;inset:0}#viewer canvas{display:block;width:100%;height:100%}#empty{position:absolute;inset:90px 0;display:grid;align-content:center;justify-items:center;gap:12px;pointer-events:none;color:#6b8066}.hand-symbol{font-size:76px;font-weight:300;color:#a3b59c}#empty p{font-size:13px}aside{border:1px solid #d8ddd3;background:#fcfcf7;border-radius:16px;overflow:hidden}.camera{position:relative;aspect-ratio:4/3;background:#d4dacd;border-bottom:1px solid #d8ddd3;overflow:hidden}.camera video{width:100%;height:100%;object-fit:cover}.camera span{position:absolute;left:14px;bottom:12px;font-size:8px;font-weight:700;letter-spacing:.12em;padding:5px 7px;background:#f6f5efdd;border-radius:4px}.controls{padding:20px}button{cursor:pointer;background:#f8f8f0;border:1px solid #c6d0bf;border-radius:7px;color:#263b32;padding:11px 16px;font-weight:600;font-size:13px}button:hover:not(:disabled){background:#e9eddf}button:disabled{opacity:.5;cursor:default}.primary{width:100%;background:#284c3a;color:#f9f9ef;border-color:#284c3a}.primary:hover:not(:disabled){background:#36644a}#status{font-size:12px;line-height:1.5;min-height:38px;margin:13px 0 22px;color:#687764}label{font-size:12px;font-weight:600;display:block;margin-bottom:9px}select{width:100%;padding:10px;background:#fffefa;border:1px solid #d0d8c9;border-radius:6px;color:#263b32;margin-bottom:24px}.range-label{display:flex;align-items:center;justify-content:space-between}.range-label label{margin:0}output{font-size:12px;font-variant-numeric:tabular-nums;color:#687764}input[type=range]{width:100%;accent-color:#3b654a;margin:16px 0 4px}.hint{font-size:11px;color:#74806f;line-height:1.65;margin:6px 0 0}.setup{margin:24px 0 26px;border:1px solid #d8ddd3;border-radius:12px;padding:24px 28px;display:grid;grid-template-columns:1fr 230px;gap:36px;align-items:center}.setup h2{font-size:21px;letter-spacing:-.5px;margin:0 0 9px;font-weight:600}.setup p:not(.eyebrow):not(.hint){font-size:13px;line-height:1.6;max-width:650px;margin:0;color:#66756a}.setup .eyebrow{margin-bottom:7px}.import{text-align:center}.import button{width:100%}details{padding:2px 0 28px;font-size:12px;color:#687764}summary{cursor:pointer;width:fit-content}details p{line-height:1.8;max-width:760px}footer{padding:22px 0 32px;border-top:1px solid #d8ddd3;display:flex;justify-content:space-between;gap:20px;font-size:10px;color:#74806f}[hidden]{display:none!important}@media(max-width:760px){header,main,footer{width:calc(100% - 32px)}header{padding:18px 0}nav{gap:16px;font-size:11px}.intro{padding:30px 0 24px}h1{letter-spacing:-1.6px}.intro>p:last-child{font-size:14px}.workspace{grid-template-columns:1fr;gap:14px}.stage{min-height:390px}.stage-top,.stage-bottom{padding:16px}.stage-bottom{font-size:9px}aside{display:grid;grid-template-columns:1fr 1fr}.camera{aspect-ratio:auto;min-height:250px;border-bottom:0}.camera video{object-fit:contain}.controls{padding:16px}#status{margin-bottom:14px}select{margin-bottom:16px}.setup{grid-template-columns:1fr;gap:20px;padding:22px}.import{text-align:left}.import button{width:auto}footer{flex-direction:column;gap:14px}.stage-label{font-size:8px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}

.command{margin:14px 0;display:flex;align-items:center;gap:10px;flex-wrap:wrap}.command code{display:block;min-width:0;overflow-wrap:anywhere;padding:12px;background:#e9eddf;border-radius:6px;font-size:11px;line-height:1.6;flex:1 1 300px}.command button{font-size:11px;white-space:nowrap}