*{box-sizing:border-box;margin:0;padding:0}html,body,#app{height:100%}body{font-family:system-ui,-apple-system,Segoe UI,sans-serif;background:#0f172a;color:#f1f5f9;-webkit-tap-highlight-color:transparent}#app{display:flex;flex-direction:column;min-height:100dvh;padding-bottom:env(safe-area-inset-bottom)}.topbar{background:#1e293b;padding:calc(.75rem + env(safe-area-inset-top)) 1rem .75rem 1rem;display:flex;align-items:center;gap:.75rem;border-bottom:1px solid #334155}.topbar-meta{margin-left:auto}.connection-dot{width:10px;height:10px;border-radius:50%;background:#475569;transition:background .2s;flex-shrink:0}.connection-dot.online{background:#10b981;box-shadow:0 0 10px #10b98180}.connection-dot.offline{background:#ef4444;animation:pulse 1.2s infinite}.topbar-title{font-size:1.1rem;font-weight:600}.topbar-meta{font-size:.85rem;color:#94a3b8}main{flex:1;display:flex;flex-direction:column;padding:1rem;padding-left:calc(1rem + env(safe-area-inset-left));padding-right:calc(1rem + env(safe-area-inset-right));gap:1rem;overflow-y:auto}.toast-host{position:fixed;left:0;right:0;bottom:calc(env(safe-area-inset-bottom) + .75rem);display:flex;flex-direction:column;align-items:center;gap:.5rem;pointer-events:none;z-index:100}.toast{pointer-events:auto;background:#1e293b;color:#f1f5f9;border:1px solid #334155;padding:.75rem 1rem;border-radius:10px;font-size:.9rem;box-shadow:0 10px 25px #00000073;max-width:calc(100vw - 2rem);transform:translateY(100%);opacity:0;transition:transform .2s ease,opacity .2s ease}.toast.in{transform:translateY(0);opacity:1}.toast.ok{border-color:#10b98173;background:#10b9811f;color:#a7f3d0}.toast.error{border-color:#ef444473;background:#ef44441f;color:#fecaca}.screen{display:flex;flex-direction:column;gap:1rem}.card{background:#1e293b;border:1px solid #334155;border-radius:12px;padding:1.5rem}h1{font-size:1.4rem;font-weight:600;margin-bottom:.5rem}h2{font-size:1.1rem;font-weight:500;margin-bottom:.75rem;color:#cbd5e1}label{display:block;font-size:.85rem;color:#94a3b8;margin-bottom:.4rem}input,button{font:inherit;width:100%;padding:.9rem 1rem;border-radius:10px;border:1px solid #475569;background:#0f172a;color:#f1f5f9}input:focus{outline:2px solid #38bdf8;outline-offset:0;border-color:#38bdf8}button{background:#2563eb;border:none;font-weight:600;cursor:pointer;transition:background .15s}button:hover:not(:disabled){background:#1d4ed8}button:disabled{background:#475569;cursor:not-allowed}button.secondary{background:#334155}button.big{padding:1.5rem 1rem;font-size:1.2rem;border-radius:14px;min-height:56px}button:active:not(:disabled){transform:translateY(1px);background:#1d4ed8}button.danger{background:#dc2626}.helper{font-size:.85rem;color:#94a3b8}.status{margin-top:.5rem;padding:.75rem;border-radius:8px;font-size:.9rem}.status.error{background:#dc262626;color:#fca5a5}.status.ok{background:#10b98126;color:#6ee7b7}.status.info{background:#38bdf826;color:#7dd3fc}.video-wrap{position:relative;background:#000;border-radius:12px;overflow:hidden;aspect-ratio:3 / 4}.video-wrap video{width:100%;height:100%;object-fit:cover;display:block}.recording-indicator{position:absolute;top:12px;left:12px;display:flex;align-items:center;gap:.5rem;background:#0000008c;padding:.35rem .75rem;border-radius:999px;font-size:.85rem;color:#fff}.recording-indicator .dot{width:10px;height:10px;border-radius:50%;background:#ef4444;animation:pulse 1s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}.timer{position:absolute;top:12px;right:12px;background:#0000008c;padding:.35rem .75rem;border-radius:999px;font-size:.85rem;color:#fff;font-variant-numeric:tabular-nums}.progress{width:100%;height:8px;background:#334155;border-radius:999px;overflow:hidden}.progress-bar{height:100%;background:linear-gradient(90deg,#38bdf8,#10b981);transition:width .2s ease}.scanner-container{min-height:260px;background:#000;border-radius:12px;overflow:hidden}.counter{background:#334155;border-radius:10px;padding:1rem;text-align:center}.counter .num{font-size:1.6rem;font-weight:700;color:#f1f5f9}.counter .label{font-size:.85rem;color:#94a3b8;margin-top:.25rem}
