:root{--bg: #f5f5f7;--panel: #ffffff;--panel-2: #f4f7fb;--text: #1d1d1f;--muted: #6e6e73;--accent: #0071e3;--accent-600: #0063c6;--accent-2: #5e5ce6;--success: #17b877;--danger: #e5484d;--border: rgba(15, 23, 42, .08);--ring: rgba(0, 113, 227, .28);--radius: 20px;--shadow-soft: 0 2px 16px -6px rgba(15, 23, 42, .12);--shadow-medium: 0 12px 40px -12px rgba(15, 23, 42, .18)}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;-webkit-font-smoothing:antialiased}#app{position:relative;max-width:1024px;margin:0 auto;padding:24px 20px 64px;display:flex;flex-direction:column;gap:24px}header{display:grid;grid-template-columns:1fr auto 1fr;align-items:flex-start;width:100%}.header-center{grid-column:2;text-align:center}header h1{margin:0;font-size:30px;font-weight:700;letter-spacing:-.03em;color:var(--text);line-height:0}header h1 span{color:var(--accent)}.tagline{margin:10px 0 0;color:var(--muted);font-size:14px;font-weight:500}.brand-logo{height:34px;width:auto;display:inline-block;vertical-align:middle}.auth-title{line-height:0}.auth-title .brand-logo{height:30px}.brand-link{display:inline-block;text-decoration:none;border-radius:8px;transition:opacity .15s ease,transform .15s ease}.brand-link:hover{opacity:.75;transform:scale(.97)}.brand-link:active{opacity:.55;transform:scale(.94)}.stage{display:flex;flex-direction:column;align-items:center;width:100%}#scan-oval-container{position:relative;width:300px;height:380px;margin:0 auto}#scan-ring-svg{position:absolute;top:0;left:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:10}.video-wrap{position:absolute;left:20px;top:20px;width:260px;height:340px;border-radius:130px;overflow:hidden;background:#dce6f5;box-shadow:0 20px 60px -20px #0071e32e,0 0 0 6px #fff;transition:box-shadow .4s ease}body.is-scanning .video-wrap{animation:ovalPulse 1.8s ease-in-out infinite}@keyframes ovalPulse{0%,to{box-shadow:0 20px 60px -20px #0071e326,0 0 0 6px #fff,0 0 #0071e300}50%{box-shadow:0 20px 60px -20px #0071e340,0 0 0 6px #fff,0 0 0 14px #0071e30f}}#video,#overlay{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}#overlay{pointer-events:none}.scan-line-container{display:none;position:absolute;left:0;right:0;top:0;height:80px;background:linear-gradient(to bottom,#0071e300,#0071e31f 40%,#0071e347,#0071e31f 60%,#0071e300);filter:blur(1px);pointer-events:none;z-index:5}body.is-scanning .scan-line-container{display:block;animation:scanY 2.4s cubic-bezier(.45,0,.55,1) infinite}.scan-line{position:absolute;bottom:50%;left:0;right:0;height:1px;transform:translateY(-50%);background:#0071e3bf;box-shadow:0 0 12px 2px #2e86ff59,0 0 24px 6px #2e86ff26}@keyframes scanY{0%{transform:translateY(0);opacity:.35}12%{opacity:1}50%{transform:translateY(260px);opacity:1}88%{opacity:1}to{transform:translateY(0);opacity:.35}}.crosshairs{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:6}.scan-progress-box{display:flex;flex-direction:column;align-items:center;text-align:center;width:100%}.scan-pct-wrap{display:none;margin-top:12px;font-size:52px;font-weight:300;line-height:1;letter-spacing:-.025em;color:#0071e3;font-variant-numeric:tabular-nums;align-items:flex-start}body.is-scanning .scan-pct-wrap{display:flex}.scan-pct-sym{margin-left:2px;font-size:22px;font-weight:400;color:#6e6e73;line-height:1.2}.scan-status-wrap{display:flex;min-height:1.75rem;align-items:center;justify-content:center;gap:8px;margin-top:20px;font-size:14px}.scan-status-text{margin:0;font-size:14px;font-weight:400;color:#6e6e73}body.is-scanning .scan-status-text{color:#6e6e73;font-weight:400}.scan-ping{display:none;position:relative;width:8px;height:8px;flex-shrink:0}body.is-scanning .scan-ping{display:flex}.scan-ping-ring{position:absolute;inset:0;border-radius:50%;background-color:#0071e366;animation:pingPulse 1s cubic-bezier(0,0,.2,1) infinite}.scan-ping-dot{position:relative;width:8px;height:8px;border-radius:50%;background-color:#0071e3}@keyframes pingPulse{75%,to{transform:scale(2);opacity:0}}.scan-dots{display:none!important}button{background:var(--accent);color:#fff;border:0;border-radius:999px;padding:12px 24px;font-size:15px;font-weight:600;letter-spacing:-.01em;cursor:pointer;box-shadow:0 4px 14px -4px #0071e373;transition:transform .08s ease,box-shadow .2s ease,background .2s ease,opacity .2s ease}button:hover{background:var(--accent-600);transform:translateY(-1px);box-shadow:0 8px 22px -6px #0071e380}button:active{transform:translateY(0) scale(.985)}button:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}.lov-controls{display:flex;flex-direction:column;align-items:center;gap:16px;width:100%;max-width:448px;margin-top:24px}.lov-btn{width:100%;border-radius:16px;padding:14px 24px;font-size:14px;font-weight:600;color:#fff;background-color:var(--accent);box-shadow:0 1px 2px #0000000d;border:none;cursor:pointer;transition:background-color .2s,transform .08s;letter-spacing:0}.lov-btn:disabled{background-color:#d2d2d7!important;color:#fff!important;box-shadow:none;cursor:not-allowed;opacity:1;transform:none}.lov-btn:hover:not(:disabled){background-color:#0063c6;transform:translateY(-1px)}body.is-scanning #start{display:none}.lov-toggles{display:flex;width:100%;flex-direction:column;gap:8px;border-radius:16px;padding:12px;background-color:#ffffffb3;box-shadow:inset 0 0 0 1px #d2d2d7}@media (min-width: 640px){.lov-toggles{flex-direction:row;align-items:center;justify-content:space-between}}.lov-toggle{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:500;color:#1d1d1f;cursor:pointer}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.lov-switch{position:relative;height:20px;width:36px;border-radius:9999px;background-color:#d2d2d7;transition:background-color .2s;flex-shrink:0}.lov-thumb{position:absolute;top:2px;left:2px;height:16px;width:16px;border-radius:50%;background-color:#fff;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;transition:all .2s}input:checked+.lov-switch{background-color:var(--accent)}input:checked+.lov-switch .lov-thumb{left:18px}.lov-toggle:has(input:disabled){opacity:.6;cursor:not-allowed}.lov-toggle:has(input:disabled) .lov-switch{cursor:not-allowed}.lov-metrics{display:flex;gap:16px;font-size:11px;font-variant-numeric:tabular-nums;color:#6e6e73;width:100%;justify-content:center}.lov-metrics b{font-weight:600;color:#1d1d1f}.results{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow-soft)}.results h2{margin:0 0 16px;font-size:19px;font-weight:700;letter-spacing:-.02em}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px}@media (max-width: 520px){.grid{grid-template-columns:repeat(2,1fr)}}.card{background:var(--panel-2);border:1px solid var(--border);border-radius:14px;padding:16px;min-height:96px;display:flex;flex-direction:column;gap:4px;transition:box-shadow .2s ease,transform .2s ease}.card:hover{box-shadow:var(--shadow-soft);transform:translateY(-1px)}.card-label{color:var(--muted);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em}.card-value{font-size:27px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.1;color:var(--text)}.card-unit{font-size:13px;font-weight:500;color:var(--muted);margin-left:4px}.card-note{font-size:11px;font-weight:600;color:var(--accent);text-transform:uppercase;letter-spacing:.04em}.hidden{display:none!important}.auth-overlay{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(1000px 700px at 85% -10%,#eef2ff,#eef2ff00 55%),linear-gradient(160deg,#f8fafc,#eef4ff,#eef2ff)}.auth-card{width:100%;max-width:400px;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:32px 28px;display:flex;flex-direction:column;gap:12px;box-shadow:var(--shadow-medium)}.auth-title{margin:0;text-align:center;font-size:26px;font-weight:700;letter-spacing:-.03em;color:var(--text)}.auth-title span{color:var(--accent)}.auth-sub{margin:2px 0 10px;text-align:center;color:var(--muted);font-size:14px;font-weight:500}.auth-card input{background:#fff;border:1px solid var(--border);border-radius:12px;padding:13px 15px;color:var(--text);font-size:15px;transition:border-color .15s ease,box-shadow .15s ease}.auth-card input::placeholder{color:#9aa3ad}.auth-card input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--ring)}.auth-actions{display:flex;gap:10px;margin-top:4px}.auth-actions button{flex:1}.auth-error{color:var(--danger);font-size:12px;min-height:15px;font-weight:500}.auth-notice{background:#0071e314;border:1px solid rgba(0,113,227,.22);color:var(--accent-600);border-radius:12px;padding:10px 12px;font-size:12px;font-weight:500}.btn-ghost{background:#fff;color:var(--text);border:1px solid var(--border);box-shadow:var(--shadow-soft)}.btn-ghost:hover{background:var(--panel-2);color:var(--text);transform:translateY(-1px);box-shadow:var(--shadow-soft)}.btn-google{width:100%;background:#fff;color:#3c4043;border:1px solid #dadce0;box-shadow:0 1px 3px #00000014;display:flex;align-items:center;justify-content:center;gap:10px;font-size:14px;font-weight:500;letter-spacing:0;padding:11px 16px}.btn-google:hover{background:#f8f9fa;color:#3c4043;border-color:#c6c6c6;transform:translateY(-1px);box-shadow:0 2px 8px #0000001f}.google-icon{flex-shrink:0}.btn-small{padding:7px 14px;font-size:13px}.auth-divider{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px;font-weight:500;margin:2px 0}.auth-divider:before,.auth-divider:after{content:"";flex:1;height:1px;background:var(--border)}.user-bar{grid-column:3;justify-self:flex-end;display:flex;align-items:center;gap:12px}.user-badge{color:var(--muted);font-size:13px;font-weight:500;font-variant-numeric:tabular-nums}.gt-form{background:var(--panel-2);border:1px solid rgba(0,113,227,.2);border-radius:14px;padding:18px;margin-bottom:18px}.gt-form h3{margin:0 0 4px;font-size:15px;font-weight:700;letter-spacing:-.01em}.gt-hint{margin:0 0 12px;color:var(--muted);font-size:12px}.gt-fields{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}@media (max-width: 520px){.gt-fields{grid-template-columns:repeat(2,1fr)}}.gt-fields label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted);font-weight:500}.gt-fields label span{font-size:11px;opacity:.75}.gt-fields .gt-wide{grid-column:1 / -1}.gt-fields input{background:#fff;border:1px solid var(--border);border-radius:10px;padding:11px 12px;color:var(--text);font-size:15px;font-variant-numeric:tabular-nums;transition:border-color .15s ease,box-shadow .15s ease}.gt-fields input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--ring)}.gt-actions{display:flex;align-items:center;gap:12px;margin-top:14px}.gt-status{font-size:12px;color:var(--muted);font-weight:500}.gt-status.gt-ok{color:var(--success)}.gt-status.gt-err{color:var(--danger)}body.has-results .stage{display:none}.scan-actions{display:none;position:fixed;left:0;right:0;bottom:0;z-index:40;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:linear-gradient(to top,var(--bg) 62%,rgba(246,248,252,0));-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}body.has-results .scan-actions{display:block}.scan-actions-row{display:flex;gap:10px;max-width:480px;margin:0 auto}.scan-actions-row button{flex:1;min-width:0}body.gt-visible #gt-open{display:none}body.gt-visible .scan-actions-row{max-width:420px}body.has-results #app{padding-bottom:104px}#app{padding-top:calc(24px + env(safe-area-inset-top))}.auth-overlay{padding-top:calc(24px + env(safe-area-inset-top));padding-bottom:calc(24px + env(safe-area-inset-bottom))}@media (max-width: 560px){#app{padding:calc(16px + env(safe-area-inset-top)) 20px 64px}header{display:flex;flex-direction:column;align-items:center;gap:16px}.user-bar{align-self:center;gap:8px}.user-badge{font-size:12px}.btn-small{padding:6px 10px;font-size:12px}.brand-logo{height:30px}.results{padding:18px 16px}.card{min-height:88px;padding:14px}.card-value{font-size:24px}.auth-card{padding:28px 20px}.lov-controls{max-width:100%;padding:0}}@media (max-width: 340px){#scan-oval-container{transform:scale(.85);transform-origin:top center;margin-bottom:-57px}.card-value{font-size:22px}}
