*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0f0f0f;--surface:#1a1a1a;--border:#2a2a2a;--text:#f0f0f0;--muted:#888;--gold:#c9a84c;--success:#22c55e;--success-bg:#052e16;--warn:#f59e0b;--warn-bg:#1c1003;--error:#ef4444;--error-bg:#1c0505}html,body{background:var(--bg);height:100%;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}#root{flex-direction:column;height:100%;display:flex}.ci-nav{background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;padding:14px 20px;display:flex}.ci-nav .brand{color:var(--text);font-size:16px;font-weight:600}.ci-nav .brand span{color:var(--gold)}.ci-nav button{border:1px solid var(--border);color:var(--muted);cursor:pointer;background:0 0;border-radius:6px;padding:6px 12px;font-size:13px}.ci-nav button:hover{border-color:var(--muted);color:var(--text)}.ci-login{flex:1;justify-content:center;align-items:center;padding:24px;display:flex}.ci-login-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;width:100%;max-width:360px;padding:32px 28px}.ci-login-card h1{margin-bottom:6px;font-size:22px}.ci-login-card p{color:var(--muted);margin-bottom:24px;font-size:14px}.ci-input{background:var(--bg);border:1px solid var(--border);width:100%;color:var(--text);border-radius:8px;outline:none;margin-bottom:12px;padding:12px 14px;font-size:15px}.ci-input:focus{border-color:var(--gold)}.ci-btn{background:var(--gold);color:#1a0f00;cursor:pointer;border:none;border-radius:8px;width:100%;padding:13px;font-size:15px;font-weight:600}.ci-btn:disabled{opacity:.5;cursor:not-allowed}.ci-btn.secondary{background:var(--surface);color:var(--text);border:1px solid var(--border)}.ci-error{color:var(--error);margin-top:10px;font-size:13px}.ci-scanner{flex-direction:column;flex:1;display:flex;overflow:hidden}.ci-viewfinder{background:#000;flex-shrink:0;max-height:55vh;position:relative;overflow:hidden}.ci-viewfinder video{width:100%;display:block}.ci-viewfinder canvas{display:none}.ci-viewfinder-overlay{pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.ci-viewfinder-box{border:2px solid var(--gold);border-radius:12px;width:220px;height:220px;box-shadow:0 0 0 9999px #00000073}.ci-viewfinder-box.scanning{animation:1.5s ease-in-out infinite scan-pulse}@keyframes scan-pulse{0%,to{border-color:var(--gold)}50%{border-color:#fff}}.ci-camera-off{min-height:200px;color:var(--muted);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:32px;font-size:14px;display:flex}.ci-result{text-align:center;z-index:10;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:24px;display:flex;position:absolute;inset:0}.ci-result.success{background:#052e16f2}.ci-result.duplicate{background:#1c1003f2}.ci-result.invalid{background:#1c0505f2}.ci-result-icon{font-size:56px;line-height:1}.ci-result-name{color:var(--text);font-size:24px;font-weight:700}.ci-result-category{color:var(--muted);font-size:14px}.ci-result-ref{color:var(--muted);font-family:monospace;font-size:12px}.ci-result-reason{color:var(--text);font-size:18px;font-weight:600}.ci-result button{color:var(--text);cursor:pointer;background:#ffffff1f;border:none;border-radius:8px;margin-top:8px;padding:10px 28px;font-size:14px}.ci-bottom{flex:1;padding:16px;overflow-y:auto}.ci-manual{gap:8px;margin-bottom:16px;display:flex}.ci-manual input{background:var(--surface);border:1px solid var(--border);color:var(--text);border-radius:8px;outline:none;flex:1;padding:10px 12px;font-size:14px}.ci-manual input:focus{border-color:var(--gold)}.ci-manual button{background:var(--gold);color:#1a0f00;cursor:pointer;white-space:nowrap;border:none;border-radius:8px;padding:10px 16px;font-size:14px;font-weight:600}.ci-manual button:disabled{opacity:.5}.ci-recent-header{letter-spacing:.1em;color:var(--muted);margin-bottom:10px;font-size:11px}.ci-recent-list{flex-direction:column;gap:8px;display:flex}.ci-recent-item{background:var(--surface);border:1px solid var(--border);border-radius:8px;justify-content:space-between;align-items:center;padding:10px 14px;display:flex}.ci-recent-item .name{font-size:14px;font-weight:500}.ci-recent-item .category{color:var(--muted);font-size:12px}.ci-recent-item .time{color:var(--muted);text-align:right;font-size:11px}
