:root{color:#17202a;background:#f5f7fa;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}html,body,#app{width:100%;height:100%;min-width:320px;min-height:100dvh;overflow:hidden;overscroll-behavior:none}*{box-sizing:border-box}body{margin:0}button{min-height:40px;border:0;border-radius:6px;padding:0 16px;color:#fff;background:#174ea6;font:inherit;font-weight:650;cursor:pointer}button.secondary{color:#17202a;background:#dfe5ec}button:disabled{color:#66717d;background:#cfd6df;cursor:not-allowed}main{width:100%;height:100dvh;min-height:100dvh;display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden}header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px clamp(16px,4vw,40px);background:#fff;border-bottom:1px solid #d8dee6}h1,h2,p{margin:0}h1{font-size:1.25rem}h2{font-size:1.125rem}header p,small,.surface p{color:#536170}.surface{width:min(760px,calc(100vw - 32px));max-height:calc(100dvh - 108px);min-height:0;margin:min(32px,4dvh) auto;padding:24px;border:1px solid #d8dee6;border-radius:8px;background:#fff;display:grid;gap:18px;overflow:hidden}.surface>*{min-width:0;min-height:0}.product-surface{height:calc(100% - 32px);max-height:none;grid-template-rows:auto minmax(0,1fr);align-self:stretch;margin:16px auto}.product-surface .section-heading{align-items:center;flex-direction:row}.product-surface .section-heading button{width:auto;min-width:96px}.login-form{display:grid;gap:14px}.login-form label{display:grid;gap:6px;color:#344150;font-weight:650}.login-form input{min-height:42px;width:100%;border:1px solid #c8d0da;border-radius:6px;padding:8px 10px;color:#17202a;background:#fff;font:inherit}.login-error{color:#9a3412}.section-heading,.scan-toolbar,.scan-action-buttons{display:flex;align-items:center;justify-content:space-between;gap:12px}.product-list{display:grid;gap:10px;align-content:start;grid-auto-rows:max-content;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-right:2px}.product-body{display:grid;grid-template-rows:auto minmax(0,1fr);gap:12px;min-height:0;overflow:hidden}.product-body>.product-list:first-child{grid-row:1 / -1}.product-row{min-height:68px;width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 14px;border-radius:6px;color:#17202a;background:#eef2f6;text-align:left}.product-row span,.product-row small{overflow-wrap:anywhere}.scan{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10;width:100vw;height:100dvh;overflow:hidden;background:#11161d;color:#fff;touch-action:none}.scan-toolbar,.scan-dev-panel{position:absolute;z-index:2;color:#fff;flex-wrap:wrap}.scan-toolbar{top:calc(env(safe-area-inset-top,0px) + 10px);left:calc(env(safe-area-inset-left,0px) + 10px);right:calc(env(safe-area-inset-right,0px) + 10px);display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:center;pointer-events:none}.scan-toolbar>*{pointer-events:auto}.scan-toolbar strong{justify-self:end;max-width:min(58vw,340px);min-height:32px;display:inline-flex;align-items:center;padding:6px 10px;border-radius:6px;color:#fff;background:#05070a8f;font-size:.875rem;line-height:1.15;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.scan-back{min-height:32px;padding:0 12px;border:1px solid rgba(255,255,255,.22);color:#fff;background:#05070a9e;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.diagnostics-image-overlay{position:absolute;z-index:2;top:calc(env(safe-area-inset-top,0px) + 54px);left:calc(env(safe-area-inset-left,0px) + 10px);right:calc(env(safe-area-inset-right,0px) + 10px);display:grid;grid-template-columns:repeat(3,minmax(0,104px));gap:8px;pointer-events:none}.diagnostics-image-overlay figure{width:100%;height:92px;margin:0;display:grid;grid-template-rows:minmax(0,1fr) auto;overflow:hidden;border:1px solid rgba(255,255,255,.2);border-radius:6px;background:#05070aa8;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.diagnostics-image-overlay img{width:100%;height:66px;object-fit:contain;image-rendering:pixelated}.diagnostics-image-overlay figcaption{min-width:0;padding:4px 5px;overflow:hidden;color:#fff;font-size:.625rem;line-height:1.1;text-align:center;text-overflow:ellipsis;white-space:nowrap;background:#0000003d}.diagnostics-image-missing:before{content:"";align-self:stretch;margin:8px;border:1px dashed rgba(255,255,255,.28);border-radius:4px;background:#ffffff0f}.scan-dev-panel{left:calc(env(safe-area-inset-left,0px) + 10px);right:calc(env(safe-area-inset-right,0px) + 10px);bottom:calc(env(safe-area-inset-bottom,0px) + 10px);display:grid;gap:8px;padding:10px;border-radius:8px;background:#05070aa3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.scan-actions{display:grid;gap:8px}.scan-action-buttons{justify-content:center;flex-wrap:wrap}.scan-actions button{min-height:32px;padding:0 10px;font-size:.875rem}.scan-status-lines{display:grid;gap:4px;text-align:center}.scan-status-lines p{color:#d9e2ec;font-size:.8125rem}.preview{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;overflow:hidden}.preview-content{position:absolute;top:0;right:0;bottom:0;left:0;transform-origin:0 0;pointer-events:none}.preview video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;background:#05070a}.overlay-layer{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none}.overlay-raster,.overlay-roi{position:absolute;pointer-events:none}.overlay-raster{object-fit:contain}.overlay-roi{box-shadow:0 0 0 1px #00000029}.preview span{position:absolute;color:#b7c3d0}.notice{padding:12px;border-radius:6px;color:#7c2d12;background:#ffedd5}.result-strip{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;padding:8px;border-radius:8px;background:#05070aad;color:#fff}.result-strip span{padding:5px 8px;border-radius:6px;background:#ffffff24;font-weight:650}.error{border-color:#c2410c}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;display:grid;place-items:center;padding:24px;background:#05070a9e}.dialog{width:min(480px,100%);display:grid;gap:16px;padding:22px;border-radius:8px;background:#fff;color:#17202a;box-shadow:0 18px 60px #05070a47}.dialog p{color:#536170;line-height:1.45}.dialog-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px}@media(max-width:560px){header,.section-heading,.dialog-actions{align-items:stretch;flex-direction:column}header button,.section-heading button,.dialog-actions button{width:100%}}@media(orientation:landscape)and (max-height:560px){.scan-toolbar{top:calc(env(safe-area-inset-top,0px) + 8px);left:calc(env(safe-area-inset-left,0px) + 8px);right:auto;width:min(42vw,360px)}.scan-toolbar strong{justify-self:start;max-width:min(28vw,260px)}.diagnostics-image-overlay{top:calc(env(safe-area-inset-top,0px) + 48px);left:calc(env(safe-area-inset-left,0px) + 8px);right:auto;width:min(42vw,360px);grid-template-columns:repeat(3,minmax(0,1fr))}.diagnostics-image-overlay figure{height:76px}.diagnostics-image-overlay img{height:52px}.scan-dev-panel{left:calc(env(safe-area-inset-left,0px) + 8px);right:calc(env(safe-area-inset-right,0px) + 8px);bottom:calc(env(safe-area-inset-bottom,0px) + 8px)}}
