*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%}body{color:#e8e8f0;background:#0a0a0f;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}#root{flex-direction:column;width:100%;height:100%;display:flex}.shenai-container{flex-direction:column;flex:1;justify-content:center;align-items:center;min-height:100dvh;padding:24px 16px;display:flex}.setup-panel{flex-direction:column;gap:24px;width:100%;max-width:520px;display:flex}.logo{text-align:center}.logo-icon{margin-bottom:10px;font-size:44px;display:block}.logo h1{background:linear-gradient(135deg,#7c6af7,#e05cf7);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:6px;font-size:clamp(1.3rem,4vw,1.7rem);font-weight:700}.logo p{color:#8888a8;font-size:clamp(.8rem,2.5vw,.9rem)}.form{background:#14141f;border:1px solid #2a2a3f;border-radius:16px;flex-direction:column;gap:14px;padding:20px;display:flex}.form label{color:#aac;flex-direction:column;gap:6px;font-size:.85rem;font-weight:500;display:flex}.form .optional{color:#666680;font-weight:400}.form input{color:#e8e8f0;-webkit-appearance:none;background:#0e0e1a;border:1px solid #2a2a3f;border-radius:10px;outline:none;padding:12px 14px;font-size:1rem;transition:border-color .2s}.form input:focus{border-color:#7c6af7}.form input::placeholder{color:#44445a}.permission-granted{color:#50d090;background:#0a2a1a;border:1px solid #1a6a40;border-radius:8px;padding:10px 14px;font-size:.85rem}.permission-denied{color:#d09050;background:#2a1a0a;border:1px solid #6a4010;border-radius:8px;padding:10px 14px;font-size:.85rem}.error-banner{color:#f06090;background:#2a1020;border:1px solid #6b2040;border-radius:8px;padding:10px 14px;font-size:.85rem}.error-hint{color:#c07080;margin-top:8px;font-size:.78rem;line-height:1.7}.start-btn{color:#fff;cursor:pointer;touch-action:manipulation;background:linear-gradient(135deg,#7c6af7,#e05cf7);border:none;border-radius:12px;min-height:52px;margin-top:4px;padding:15px;font-size:1rem;font-weight:600;transition:opacity .2s,transform .15s}.start-btn:hover{opacity:.9;transform:translateY(-1px)}.start-btn:active{opacity:.8;transform:translateY(0)}.info-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.info-card{background:#14141f;border:1px solid #2a2a3f;border-radius:12px;flex-direction:column;gap:4px;padding:14px;display:flex}.info-card span{font-size:1.3rem}.info-card strong{color:#c8c8e8;font-size:.85rem}.info-card p{color:#666680;font-size:.75rem;line-height:1.4}.loading-panel{text-align:center;flex-direction:column;align-items:center;gap:16px;width:100%;max-width:360px;padding:24px 16px;display:flex}.camera-icon{font-size:56px;animation:1.5s ease-in-out infinite pulse}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.spinner{border:3px solid #2a2a3f;border-top-color:#7c6af7;border-radius:50%;width:44px;height:44px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.loading-panel h2{color:#c8c8e8;font-size:clamp(1rem,3vw,1.15rem)}.loading-panel p{color:#8888a8;font-size:.85rem;line-height:1.5}.progress-bar{background:#2a2a3f;border-radius:99px;width:min(280px,80vw);height:6px;overflow:hidden}.progress-fill{background:linear-gradient(90deg,#7c6af7,#e05cf7);border-radius:99px;height:100%;transition:width .3s}.sdk-event{color:#8888a8;margin-top:4px;font-size:.75rem}.measurement-panel{background:#000;justify-content:stretch;align-items:stretch;width:100dvw;height:100dvh;display:flex;position:fixed;inset:0}#mxcanvas{display:block;width:100%!important;height:100%!important}@media (width>=768px){.shenai-container{padding:32px 24px}.setup-panel{gap:28px}.form{padding:28px}.logo-icon{font-size:52px}.info-grid{gap:14px}.info-card{padding:18px}.info-card strong{font-size:.9rem}.info-card p{font-size:.78rem}}@media (width<=480px){.shenai-container{padding:16px 12px;padding-top:max(24px, env(safe-area-inset-top));padding-bottom:max(16px, env(safe-area-inset-bottom));justify-content:flex-start}.setup-panel{gap:16px}.logo-icon{margin-bottom:8px;font-size:36px}.form{border-radius:14px;gap:12px;padding:16px}.info-grid{grid-template-columns:1fr 1fr;gap:8px}.info-card{border-radius:10px;padding:12px}.info-card span{font-size:1.1rem}.start-btn{border-radius:14px;padding:16px;font-size:1rem}.measurement-panel{padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}}@media (width<=360px){.info-grid{grid-template-columns:1fr}}
