*{box-sizing:border-box}body{font-family:system-ui,sans-serif;margin:0;background:#111;color:#eee}header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 24px;border-bottom:1px solid #333}.brand{max-width:60%}.brand-title{display:flex;align-items:center;gap:10px}.brand-title .logo{width:36px;height:36px;flex:none}h1{margin:0;font-size:1.4rem}.tagline{margin:4px 0 0;font-size:.8rem;color:#9a9a9a;line-height:1.4}.buttons button{margin-left:8px;padding:10px 18px;font-weight:700;border:0;border-radius:6px;cursor:pointer}#check-in{background:#2e9e5b;color:#fff}#check-out{background:#b85c2e;color:#fff}main{max-width:720px;margin:24px auto;padding:0 16px}.record{display:flex;align-items:center;gap:16px;padding:12px;border:1px solid #333;border-radius:8px;margin-bottom:12px}.record .meta{flex:1;display:flex;flex-direction:column;gap:2px;font-size:.9rem}.record .dir{font-weight:800}.record.in .dir{color:#4cc47f}.record.out .dir{color:#e08a52}.record .fp,.record .geo{color:#999;font-size:.8rem}.record .qr img{width:72px;height:72px;background:#fff;border-radius:4px}.empty,.error{color:#999;text-align:center}.overlay{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:10}.panel{background:#1b1b1b;border:1px solid #444;border-radius:10px;padding:20px;width:min(480px,92vw);text-align:center}.panel .stage{width:100%;aspect-ratio:4 / 3;background:#000;border-radius:8px;overflow:hidden;display:flex;align-items:center;justify-content:center}.panel .stage video{width:100%;height:100%;object-fit:cover}.panel .result-qr{width:62%;max-width:260px;aspect-ratio:1;background:#fff;padding:12px;border-radius:8px}.panel .status{min-height:1.4em;margin:12px 0 4px}.panel .camera-row{display:block;font-size:.8rem;color:#9a9a9a;margin:0 0 8px}.panel .camera-row select{max-width:100%;margin-left:6px;padding:4px 6px;border-radius:6px;border:1px solid #555;background:#2a2a2a;color:#eee}.panel .privacy{font-size:.78rem;color:#9a9a9a;line-height:1.45;margin:0 0 4px}.panel .actions button{margin:0 6px;padding:8px 16px;border-radius:6px;border:1px solid #555;background:#2a2a2a;color:#eee;cursor:pointer}.panel .actions .action{background:#2e9e5b;border-color:#2e9e5b;color:#fff;font-weight:700}
