/* AS Surface OS 215A11B — Guided Live Scan UX + diagnostics */
.as215-cap-v2 .as215-cap-modal{width:min(1660px,calc(100vw - 18px));max-height:98vh;overflow:auto}
.as215-cap-v2 .as215-cap-modal>header{align-items:center}
.as215-cap-head-status{display:flex;align-items:center;gap:10px}.as215-cap-vision{display:inline-flex;align-items:center;min-height:34px;padding:7px 10px;border-radius:999px;border:1px solid #d8cfbf;background:#f4eee4;color:#6a5a48;font-size:9px;font-weight:900;letter-spacing:.04em}.as215-cap-vision.ready{background:#e8f6ef;border-color:#b9dec9;color:#216c4c}.as215-cap-vision.offline{background:#fff0ed;border-color:#ebc0b7;color:#943f30}
.as215-cap-v2 .as215-cap-live-grid{grid-template-columns:minmax(0,1.7fr) minmax(330px,.55fr);align-items:start}.as215-cap-v2 .as215-cap-camera{min-width:0}
.as215-cap-v2 .as215-cap-stage{height:clamp(520px,68vh,820px);aspect-ratio:auto;border-radius:16px;background:#070b0c;border:2px solid #344245;box-shadow:inset 0 0 0 1px rgba(255,255,255,.03)}.as215-cap-v2 .as215-cap-stage video{width:100%;height:100%;object-fit:contain;background:#070b0c}
.as215-cap-guide{position:absolute;inset:7%;pointer-events:none;border:1px solid rgba(235,195,130,.24);z-index:2}.as215-cap-guide .c{position:absolute;width:48px;height:48px;border-color:#efc37d;border-style:solid;filter:drop-shadow(0 2px 3px rgba(0,0,0,.55))}.as215-cap-guide .tl{left:-2px;top:-2px;border-width:4px 0 0 4px}.as215-cap-guide .tr{right:-2px;top:-2px;border-width:4px 4px 0 0}.as215-cap-guide .bl{left:-2px;bottom:-2px;border-width:0 0 4px 4px}.as215-cap-guide .br{right:-2px;bottom:-2px;border-width:0 4px 4px 0}.as215-cap-guide .grid{position:absolute;background:rgba(255,255,255,.13)}.as215-cap-guide .v1,.as215-cap-guide .v2{top:0;bottom:0;width:1px}.as215-cap-guide .v1{left:33.333%}.as215-cap-guide .v2{left:66.666%}.as215-cap-guide .h1,.as215-cap-guide .h2{left:0;right:0;height:1px}.as215-cap-guide .h1{top:33.333%}.as215-cap-guide .h2{top:66.666%}.as215-cap-guide .cross{position:absolute;left:50%;top:50%;width:38px;height:38px;transform:translate(-50%,-50%)}.as215-cap-guide .cross b{position:absolute;background:#efc37d;border-radius:2px;box-shadow:0 1px 3px rgba(0,0,0,.6)}.as215-cap-guide .cross b:first-child{width:2px;height:38px;left:18px}.as215-cap-guide .cross b:last-child{height:2px;width:38px;top:18px}.as215-cap-guide .guide-label{position:absolute;left:50%;top:8px;transform:translateX(-50%);padding:5px 8px;border-radius:999px;background:rgba(7,11,12,.7);color:#f1d3a0;font-size:8px;font-weight:900;letter-spacing:.08em;white-space:nowrap}
.as215-cap-reference{position:absolute;z-index:6;transform:translate(-50%,-50%);pointer-events:none}.as215-cap-reference i{display:block;width:22px;height:22px;border:3px solid #ffd166;border-radius:50%;box-shadow:0 0 0 3px rgba(0,0,0,.45),0 0 18px rgba(255,209,102,.6)}.as215-cap-reference i:before,.as215-cap-reference i:after{content:"";position:absolute;background:#ffd166}.as215-cap-reference i:before{width:34px;height:2px;left:-6px;top:10px}.as215-cap-reference i:after{height:34px;width:2px;left:10px;top:-6px}.as215-cap-reference span{position:absolute;left:18px;top:-17px;background:#ffd166;color:#241b0d;border-radius:4px;padding:3px 5px;font-size:8px;font-weight:900}
.as215-cap-scan-state{position:absolute;z-index:7;left:12px;top:12px;display:grid;grid-template-columns:auto auto;column-gap:7px;row-gap:1px;align-items:center;padding:8px 10px;border-radius:10px;background:rgba(9,13,14,.86);color:#fff;border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(7px)}.as215-cap-scan-state>i{width:10px;height:10px;border-radius:50%;background:#d6a655;grid-row:1/3}.as215-cap-scan-state b{font-size:9px;letter-spacing:.06em}.as215-cap-scan-state span{font-size:8px;color:#c8cecc}.as215-cap-scan-state[data-cap-state="ready"]>i{background:#36c98a}.as215-cap-scan-state[data-cap-state="scanning"]>i{background:#5da0ff;animation:as215pulse .8s infinite alternate}.as215-cap-scan-state[data-cap-state="found"]>i{background:#36c98a;box-shadow:0 0 0 5px rgba(54,201,138,.14)}.as215-cap-scan-state[data-cap-state="warning"]>i{background:#f1b34f}.as215-cap-scan-state[data-cap-state="error"]>i{background:#ec665a}.as215-cap-stage.is-scanning{border-color:#5da0ff}.as215-cap-sweep{display:none;position:absolute;z-index:4;left:6%;right:6%;height:2px;background:linear-gradient(90deg,transparent,#6ab2ff 15%,#fff 50%,#6ab2ff 85%,transparent);box-shadow:0 0 14px rgba(89,170,255,.8);top:10%}.as215-cap-stage.is-scanning .as215-cap-sweep{display:block;animation:as215scan 1.65s linear infinite}@keyframes as215scan{0%{top:10%}50%{top:88%}100%{top:10%}}@keyframes as215pulse{from{opacity:.35;transform:scale(.8)}to{opacity:1;transform:scale(1.25)}}
.as215-cap-v2 .as215-cap-camera-status{left:12px;right:12px;bottom:12px;max-width:none;font-size:10px;padding:9px 11px;z-index:7;border:1px solid rgba(255,255,255,.12)}.as215-cap-quality{position:absolute;z-index:7;right:12px;top:12px;background:rgba(8,12,12,.78);color:#e6ece9;padding:7px 9px;border-radius:9px;font-size:8px;border:1px solid rgba(255,255,255,.12)}.as215-cap-quality[data-q="warn"]{color:#ffd7a0;border-color:rgba(239,182,96,.4)}.as215-cap-quality[data-q="good"]{color:#a9ebc9;border-color:rgba(84,194,139,.35)}
.as215-cap-v2 .as215-cap-overlay{z-index:5}.as215-cap-v2 .as215-cap-box{border-width:4px;box-shadow:0 0 0 2px rgba(0,0,0,.46),0 0 22px color-mix(in srgb,var(--cap) 35%,transparent)}.as215-cap-v2 .as215-cap-box span{font-size:10px;top:-29px;padding:5px 7px}
.as215-cap-v2 .as215-cap-controls{grid-template-columns:minmax(180px,1.2fr) auto auto auto}.as215-cap-v2 .as215-cap-controls button{min-height:46px}.as215-cap-stepbar{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:9px}.as215-cap-stepbar span{padding:6px 7px;border-radius:8px;background:#eee7dc;color:#746a5d;font-size:8px;text-align:center;border:1px solid #ded4c5}.as215-cap-stepbar .active{background:#172022;color:#fff;border-color:#172022}.as215-cap-v2 .as215-cap-hint{font-size:9px;line-height:1.5}.as215-cap-v2 .as215-cap-side{position:sticky;top:0}.as215-cap-live-help{display:grid;gap:5px;padding:9px;border-radius:10px;background:#f7f2ea;border:1px solid #e3d7c8}.as215-cap-live-help strong{font-size:9px}.as215-cap-live-help span{font-size:8px;color:#686760;display:flex;align-items:center;gap:6px}.as215-cap-live-help .dot{width:8px;height:8px;border-radius:50%;display:inline-block}.as215-cap-live-help .ready,.as215-cap-live-help .found{background:#36c98a}.as215-cap-live-help .scanning{background:#5da0ff}.as215-cap-live-help .error{background:#ec665a}.as215-cap-empty-result{padding:18px 12px;border:1px dashed #d7cbbd;border-radius:10px;background:#faf7f1;color:#74736d;font-size:9px;line-height:1.5;text-align:center}.as215-cap-empty-result.warn{background:#fff7e8;border-color:#ebc989;color:#76531d}.as215-cap-empty-result.error{background:#fff0ed;border-color:#e8b3a9;color:#8b372d}
@media(max-width:1100px){.as215-cap-v2 .as215-cap-live-grid{grid-template-columns:minmax(0,1fr) 300px}.as215-cap-v2 .as215-cap-stage{height:clamp(470px,62vh,720px)}}
@media(max-width:900px){.as215-cap-v2{padding:0;align-items:stretch}.as215-cap-v2 .as215-cap-modal{width:100%;height:100dvh;max-height:none;border-radius:0;padding:10px;display:block}.as215-cap-v2 .as215-cap-modal>header{position:sticky;top:0;z-index:20;background:#fbf8f2;padding:8px 0 10px}.as215-cap-v2 .as215-cap-modal>header p{display:none}.as215-cap-v2 .as215-cap-vision{font-size:7.5px;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.as215-cap-v2 .as215-cap-live-grid{grid-template-columns:1fr}.as215-cap-v2 .as215-cap-stage{height:60dvh;min-height:420px;max-height:720px}.as215-cap-v2 .as215-cap-side{position:static;order:2}.as215-cap-v2 .as215-cap-controls{grid-template-columns:1fr 1fr}.as215-cap-v2 .as215-cap-controls label{grid-column:1/-1}.as215-cap-stepbar{grid-template-columns:1fr 1fr}.as215-cap-guide{inset:5%}.as215-cap-guide .guide-label{font-size:7px}.as215-cap-quality{top:auto;bottom:50px;right:10px}.as215-cap-v2 .as215-cap-modal>footer{position:sticky;bottom:0;z-index:20;background:#fbf8f2}}
@media(max-width:520px){.as215-cap-v2 .as215-cap-modal{padding:8px}.as215-cap-v2 .as215-cap-modal>header h2{font-size:16px}.as215-cap-head-status{gap:6px}.as215-cap-v2 .as215-cap-stage{height:58dvh;min-height:390px}.as215-cap-v2 .as215-cap-controls{grid-template-columns:1fr 1fr}.as215-cap-v2 .as215-cap-controls label{grid-column:1/-1}.as215-cap-v2 .as215-cap-controls button{font-size:10px;padding:9px 7px}.as215-cap-scan-state{left:8px;top:8px}.as215-cap-quality{right:8px}.as215-cap-guide .c{width:34px;height:34px}.as215-cap-stepbar span{font-size:7px}.as215-cap-v2 .as215-cap-side{padding:10px}.as215-cap-v2 .as215-cap-detected{max-height:none}}
