:root{--bg:#161d19;--fg:#eef5ef;--acc:#5fc79c;--bad:#ff6b5e;--warn:#f3b13b}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:18px/1.5 system-ui,"Hiragino Sans","Noto Sans JP",sans-serif;min-height:100vh}
.top{display:flex;gap:8px;align-items:center;padding:8px 12px;background:#0003;position:sticky;top:0;z-index:2}
.title{flex:1;font-weight:700;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.status{font-size:.8rem;color:#bcd}.status.warn{color:var(--warn)}
.hot{width:44px;height:44px}
.cam{position:relative;background:#000;aspect-ratio:4/3;max-height:45vh}
.cam video{width:100%;height:100%;object-fit:cover}
.result{position:fixed;left:8px;right:8px;top:30%;z-index:5;border-radius:16px;padding:24px;text-align:center;font-size:1.2rem}
.result .big{font-size:3rem;font-weight:800}
.result.ok{background:#1f8a5b}.result.dup{background:#d9831f}.result.bad{background:#b3362b}
.manual{padding:8px 12px}.codebox{font:700 1.8rem ui-monospace,monospace;text-align:center;letter-spacing:.1em;padding:6px;min-height:3rem}
.pad{display:grid;grid-template-columns:repeat(8,1fr);gap:6px}
.pad button{min-height:48px;font-size:1.1rem}
button{background:#fff2;color:var(--fg);border:1px solid #fff4;border-radius:8px;padding:8px;font:inherit}
button.go{background:var(--acc);color:#012;grid-column:span 2}button.danger{border-color:var(--bad);color:var(--bad)}
.panel{position:fixed;inset:0;background:var(--bg);z-index:9;padding:16px;overflow:auto}
.enroll{padding:16px;max-width:480px;margin:0 auto}.enroll input{width:100%;font-size:2rem;text-align:center;letter-spacing:.1em;padding:8px;border-radius:8px;border:1px solid #fff4;background:#fff1;color:var(--fg)}
.msg{color:var(--warn)}