/* Lokale Bedienungsdemo auf den Originalaufnahmen. Alle Werte sind Beispieldaten. */
.recording-camera{display:block;position:absolute;top:0;left:0;width:100%;aspect-ratio:1.44;container-type:inline-size;transform-origin:0 0;transform:var(--camera-start);pointer-events:none}
.recording-image{position:absolute;inset:0 auto auto 0;width:100%;height:auto;transform:none!important;animation:none!important}
.story-scene.is-current .recording-camera{animation:recording-camera var(--scene-duration) cubic-bezier(.22,.68,.25,1) both;animation-play-state:paused!important;animation-delay:var(--scene-elapsed,0ms)}

[data-recording='research']{--camera-start:translate(-2%,-1%) scale(1.04)}
[data-recording='research'] .recording-camera{aspect-ratio:1440/1763}
[data-recording='orders']{--camera-start:translate(-1%,-1%) scale(.9);--camera-end:translate(-1%,-9%) scale(1.03)}
[data-recording='orders'] .recording-camera{width:140%;aspect-ratio:1440/813}
[data-recording='orders'] .recording-image{width:100%}
.story-is-static .recording-camera{animation:none!important;transform:var(--camera-end)}
.story-scene.is-current[data-recording='schedule'] .recording-camera{animation-name:schedule-camera}
@keyframes schedule-camera{0%,10%{transform:var(--camera-start)}32%,72%{transform:var(--camera-end)}88%,100%{transform:translate(-82%,-78%) scale(1.85)}}
.story-is-playing .wire-amazon i{display:block;animation-direction:reverse;animation-delay:.4s}
.hero-work,.demo-pointer{display:none}
.work-ready .hero-work{display:flex;position:absolute;flex-direction:column;background:#fff;color:#17202b;font:400 .98cqw/1.45 Arial,sans-serif;overflow:hidden;text-align:left}
.hero-work strong,.hero-work b{font-weight:600}.hero-work small{font-size:.91cqw;color:#586277}.hero-work i{font-style:normal}
.work-top{display:flex;justify-content:space-between;align-items:center;gap:1cqw;line-height:1.4}
.work-top strong{font-size:1.17cqw}.work-top>b{font-size:1.3cqw;font-variant-numeric:tabular-nums}
.work-meter{display:block;height:.55cqw;flex-shrink:0;border-radius:1cqw;background:#eee9f7;overflow:hidden}
.work-meter>span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#6321be,#a17ce6)}
.work-summary{display:flex;align-items:center;gap:1.8cqw;color:#586277;flex-wrap:wrap}.work-summary b{color:#17202b}
.work-bottom{display:flex;align-items:center;justify-content:space-between;gap:1cqw;color:#586277;margin-top:auto}
.work-native-button{display:inline-flex;align-items:center;justify-content:center;background:#6221bf;color:#fff;border-radius:.75cqw;padding:.65cqw 1.2cqw;font-weight:600;white-space:nowrap;box-shadow:0 0 0 1px #6221bf}
.work-scan-head{padding:1.25cqw 1.5cqw;gap:1.1cqw;border-radius:.8cqw}
.work-ready .work-tabs{flex-direction:row;align-items:center;gap:.6cqw;white-space:nowrap}
.work-tabs>b,.work-tabs>span{border:1px solid #e1e3e8;border-radius:2cqw;padding:.55cqw 1cqw}
.work-tabs>b{background:#6422bd;color:#fff;border-color:#6422bd}
.work-table-head,.work-table-row{display:grid;grid-template-columns:1.45fr 1fr 1.35fr;align-items:center;gap:1cqw;padding:.6cqw 1.2cqw;border-bottom:1px solid #e1e3e8}
.work-table-head{font-size:.91cqw;background:#f5f6f8;color:#596379;font-weight:600;min-height:2.7cqw}
.work-table-row{flex:1;min-height:0}.work-table-row:has(.is-working){background:#faf7ff}
.work-table-footer{font-size:.9cqw;color:#6b7080;padding:.4cqw 1.2cqw;background:#fcfbff}
.work-pill{display:inline-flex;justify-self:start;align-self:center;border-radius:2cqw;padding:.2cqw .8cqw;font-weight:600;font-size:.91cqw;color:#696577;background:#f1f0f5;white-space:nowrap}
.work-pill.is-done{background:#e1f5ee;color:#087a61}.work-pill.is-working{background:#eee6fc;color:#6529c4}
.work-ready .work-result-line{flex-direction:row;align-items:center;color:#087a61;font-size:1.05cqw}
.work-research-progress{padding:1.25cqw 1.5cqw;gap:1.15cqw;border-radius:.8cqw}
.work-ready .work-research-title{flex-direction:row;gap:.55cqw;align-items:center}.work-research-title strong{font-size:1.2cqw}
.work-ready .work-research-transfer{flex-direction:row;align-items:center;gap:1.2cqw;padding:.5cqw 1cqw;border:1px solid #e4e6ed;border-radius:.7cqw}
.work-research-transfer>span:last-child{margin-left:auto;color:#586277;font-size:.86cqw}
.work-ready .work-listing-progress{padding:1.2cqw;background:#f6f7f9;border-radius:.8cqw;gap:1cqw}
.work-metrics{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:.75cqw}.work-metrics>span{display:flex;flex-direction:column;gap:.1cqw;background:#fff;border:1px solid #e1e3eb;border-radius:.7cqw;padding:.7cqw 1cqw}
.work-metrics>span:first-child{border-color:#a782e9}.work-metrics b{font-size:1.7cqw;line-height:1.3;color:#6321be}.work-metrics>span:nth-child(2) b{color:#087a61}
.work-ready .work-listing-step{flex-direction:row;gap:.4cqw;align-items:center}
.work-listing-note{padding:.6cqw 1.2cqw;gap:.2cqw;border-left:.2cqw solid #8450db}
.work-ready .work-orders{background:#f7f7fc;gap:.7cqw;font-size:1.05cqw}
.work-orders-meta{font-size:.96cqw;color:#586277}
.work-orders-metrics{display:grid;grid-template-columns:repeat(5,1fr);gap:.7cqw}
.work-order-metric{display:flex;align-items:center;gap:.65cqw;background:white;border:1px solid #e7e4f1;border-radius:1cqw;padding:1cqw .8cqw}
.work-order-metric>i{display:grid;place-items:center;width:2.7cqw;height:2.7cqw;background:#eee7ff;color:#6431c3;border-radius:50%;font-size:1.5cqw}
.work-order-metric:last-child>i{background:#dcfce8;color:#078348}.work-order-metric>span{display:flex;flex-direction:column}
.work-order-metric b{font-size:1.55cqw;line-height:1.1}.work-order-metric small{font-size:.82cqw;white-space:nowrap;color:#344054}
.work-order-metric.active{border-color:#8d52dd;box-shadow:0 0 0 1px #8d52dd}
.work-orders-actions{display:flex;align-items:center;gap:.8cqw;font-size:.91cqw;padding:.3cqw 0}
.work-orders-actions>.work-native-button{border-radius:2cqw;padding:.7cqw 1.1cqw}
.work-orders-actions>span:last-child{font-size:.8cqw;color:#586277}
.work-orders-tabs{display:flex;gap:.5cqw;padding:.25cqw 0}
.work-orders-tabs>span{border:1px solid #e1dcec;border-radius:.7cqw;padding:.45cqw .8cqw;background:white;font-size:.9cqw}
.work-orders-tabs>.selected{background:#6123bc;border-color:#6123bc;color:white}
.work-orders-run{display:flex;flex-direction:column;gap:.65cqw;padding:.7cqw 1cqw;background:white;border:1px solid #e4dfef;border-radius:.8cqw}
.work-order-dots{display:flex;gap:.5cqw}.work-order-dots>span{flex:1;text-align:center;font-size:.85cqw;border-radius:.5cqw;background:#f2f0f7;color:#7b7189;padding:.3cqw}
.work-order-dots>.is-done{background:#dff4e9;color:#087a61}.work-order-dots>.is-working{background:#6c2ac5;color:#fff}
.work-order-list{display:flex;flex-direction:column;gap:.5cqw}
.work-order-row{display:flex;align-items:center;gap:1cqw;background:white;border:1px solid #e4dfef;border-radius:.8cqw;padding:.65cqw 1cqw}
.work-order-row>i{display:grid;place-items:center;width:2.8cqw;height:2.8cqw;background:#f3eefe;color:#8c6cb6;border-radius:.5cqw;font-size:1.4cqw}
.work-order-row>span:nth-child(2){display:flex;flex-direction:column;gap:.2cqw;flex:1}.work-order-row strong{font-size:1cqw}.work-order-row small{font-size:.86cqw}.work-order-row .work-pill{font-size:.85cqw}
.work-orders-foot{font-size:.94cqw;color:#577164;padding:.2cqw}
.work-ready .work-time-field,.work-ready .work-interval-field{flex-direction:row;align-items:center;justify-content:space-between;padding:0 .8cqw;background:white;border-radius:.5cqw;overflow:visible}
.work-time-field.editing,.work-interval-field.editing{box-shadow:0 0 0 2px #a17ce6}.work-time-field.editing>span:first-child{background:#e8dcfc;color:#5b1eb6}
.work-ready .work-schedule-summary{background:#f6f7f9;font-size:.91cqw;justify-content:center;line-height:1.4}
.work-ready .work-schedule-save{align-items:center;justify-content:center;background:#6221bf;border-radius:.75cqw;color:white;font-weight:600}
.work-schedule-save.saved{background:#087a61}
.work-ready .work-schedule-result{font-size:.83cqw;color:#586277;align-items:center;justify-content:center;white-space:nowrap}
.work-ready .work-interval-menu{display:none;background:white;border:1px solid #bca5dc;box-shadow:0 .5cqw 1.5cqw #32134b22;border-radius:.5cqw;z-index:5}
.work-ready .work-interval-menu.open{display:flex}.work-interval-menu>span,.work-interval-menu>b{padding:.55cqw .85cqw;flex:1;display:flex;align-items:center;justify-content:space-between}.work-interval-menu>b{background:#eee5fc;color:#6221bf}
.work-ready .demo-pointer{display:block;position:absolute;left:0;top:0;width:3.1cqw;height:3.8cqw;z-index:9;filter:drop-shadow(0 .2cqw .35cqw #25143855);pointer-events:none;transform:scale(var(--pointer-scale,1));transform-origin:0 0}
.demo-pointer svg{width:100%;height:100%;overflow:visible}.demo-click{position:absolute;top:-1.7cqw;left:-1.7cqw;width:3.8cqw;height:3.8cqw;border:.25cqw solid #9d72e4;background:#a87ce829;border-radius:50%;opacity:var(--click-strength,0);transform:scale(var(--click-size,1))}
.story-is-static .demo-pointer{display:none}
@media(prefers-reduced-motion:reduce){.recording-camera{animation:none!important;transform:var(--camera-end)}.demo-pointer{display:none!important}}

.work-ready .work-listing-title{flex-direction:row;align-items:center;gap:1cqw;font-size:1.15cqw;font-weight:600}
.work-ready .work-listing-start{justify-content:center;align-items:center;border-radius:.8cqw;background:#6321be;color:white;font-size:.95cqw;font-weight:600}
.work-research-table .work-table-head,.work-research-table .work-table-row{grid-template-columns:.35fr 2.8fr 1fr 1.2fr;gap:.7cqw;padding:.7cqw 1cqw}
.work-research-table .work-table-row{font-size:1.02cqw}.work-research-table .work-table-row.selected{background:#efe7fb}
.work-research-table .work-table-head>span:first-child,.work-research-table .work-table-row>span:first-child{display:grid;place-items:center;width:1.25cqw;height:1.25cqw;background:white;border:1px solid #a8a0b7;border-radius:.25cqw;font-size:.9cqw}
.work-research-table .work-table-row.selected>span:first-child,.work-research-table .work-table-head:has(.checked)>span:first-child{background:#6422bd;color:white;border-color:#6422bd}

/* KI-generierte Beispielprodukte, vollständig sichtbar und ohne Anschnitt. */
.work-product{display:flex;align-items:center;gap:.8cqw;min-width:0}.work-product img,.work-product-photo{display:block;width:4.2cqw;height:4.2cqw;flex-shrink:0;object-fit:contain;background:#fff;border:1px solid #ece8f0;border-radius:.5cqw;padding:.15cqw}.work-product>span{min-width:0}.work-product small{display:block;margin-top:.2cqw}
.work-order-row>.work-product-photo{width:3.4cqw;height:3.4cqw}
.work-listing-products{border:1px solid #e1e3eb;border-radius:.6cqw}.work-listing-columns,.work-listing-product{display:grid;grid-template-columns:2.8fr .6fr 1.3fr;gap:1cqw;align-items:center;padding:.7cqw 1cqw;border-bottom:1px solid #e1e3eb}.work-listing-columns{background:#f5f6f8;color:#586277;font-size:.9cqw}.work-listing-product{flex:1;min-height:0}.work-listing-product .work-product img{width:4.5cqw;height:4.5cqw}
.story-scene.is-current[data-recording='listing'] .recording-camera{animation-name:listing-camera}
@keyframes listing-camera{0%,12%{transform:var(--camera-start)}45%,58%{transform:var(--camera-end)}85%,100%{transform:translate(-8%,-65%) scale(1.45)}}
