*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;display:flex;justify-content:center;align-items:center;padding:20px}.container{max-width:900px;width:100%;background:#fff;border-radius:20px;padding:40px;box-shadow:0 20px 60px #0000004d}h1{text-align:center;color:#333;font-size:3em;margin-bottom:10px}.subtitle{text-align:center;color:#666;font-size:1.2em;margin-bottom:30px}.video-container{position:relative;width:100%;max-width:640px;margin:0 auto 30px;border-radius:15px;overflow:hidden;box-shadow:0 10px 30px #0003;background:#000}#video{width:100%;height:auto;display:block}#overlay{position:absolute;top:0;left:0;width:100%;height:100%}.stats-overlay{position:absolute;top:10px;left:10px;background:#000000d9;color:#0f0;padding:12px 15px;border-radius:8px;font-family:Courier New,monospace;font-size:1em;font-weight:700;line-height:1.6;border:2px solid #00ff00;box-shadow:0 0 10px #00ff004d;z-index:100}.emoji-results{margin-bottom:20px}.emoji-results h2{text-align:center;color:#333;font-size:1.5em;margin-bottom:20px}.emoji-list{display:flex;justify-content:center;gap:30px;flex-wrap:wrap}.emoji-item{display:flex;flex-direction:column;align-items:center;padding:20px;background:#f8f9fa;border-radius:15px;min-width:120px;min-height:180px;transition:transform .2s}.emoji-item:hover{transform:translateY(-5px)}.emoji-icon{font-size:4em;margin-bottom:10px;line-height:1;height:1em;display:flex;align-items:center;justify-content:center}.emoji-confidence{color:#666;font-size:.9em;font-weight:600}.emoji-label{color:#999;font-size:.8em;margin-top:5px;text-transform:capitalize}.expression-bars{background:#f8f9fa;border-radius:10px;padding:20px;margin-bottom:20px}.expression-bars h3{color:#333;font-size:1.2em;margin-bottom:15px}.expression-bar{margin-bottom:10px}.expression-bar-label{display:flex;justify-content:space-between;font-size:.9em;color:#666;margin-bottom:3px}.expression-bar-fill{height:20px;background:#e0e0e0;border-radius:5px;overflow:hidden}.expression-bar-value{height:100%;background:linear-gradient(90deg,#667eea,#764ba2);transition:width .3s ease}.qr-button{position:fixed;top:20px;left:20px;width:50px;height:50px;background:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5em;cursor:pointer;z-index:1000;box-shadow:0 4px 12px #0000004d;transition:transform .2s}.qr-button:hover{transform:scale(1.1)}.qr-modal{display:none;position:fixed;z-index:2000;left:0;top:0;width:100%;height:100%;background-color:#000c;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.qr-modal.active{display:flex;align-items:center;justify-content:center}.qr-modal-content{background:#fff;padding:40px;border-radius:20px;text-align:center;max-width:90vw;max-height:90vh;position:relative;box-shadow:0 20px 60px #00000080}.qr-close{position:absolute;top:15px;right:20px;font-size:2em;font-weight:700;color:#999;cursor:pointer;transition:color .2s;z-index:10}.qr-close:hover{color:#333}.qr-modal-content h2{color:#333;margin-bottom:20px}.qr-modal-content p{color:#666;margin-bottom:20px}#qr-code{display:flex;justify-content:center;align-items:center;margin:20px auto;max-width:60vh;max-height:60vh}#qr-code img,#qr-code canvas{width:100%!important;height:auto!important;max-width:60vh!important;border-radius:10px}.qr-url{font-family:Courier New,monospace;font-size:.9em;color:#667eea;word-break:break-all;font-weight:700}.burger-menu{position:fixed;top:20px;right:20px;width:40px;height:35px;cursor:pointer;z-index:1000;display:flex;flex-direction:column;justify-content:space-between}.burger-menu span{display:block;height:4px;background:#333;border-radius:2px;transition:all .3s;box-shadow:0 2px 4px #0003}.burger-menu.active span:nth-child(1){transform:rotate(45deg) translate(10px,10px)}.burger-menu.active span:nth-child(2){opacity:0}.burger-menu.active span:nth-child(3){transform:rotate(-45deg) translate(10px,-10px)}.settings-panel{position:fixed;top:0;right:-350px;width:320px;height:100vh;background:#fff;box-shadow:-5px 0 20px #0000004d;z-index:999;padding:80px 30px 30px;transition:right .3s ease;overflow-y:auto}.settings-panel.active{right:0}.settings-panel h3{margin-bottom:30px;color:#333;font-size:1.5em}.settings-panel h4{margin:20px 0 15px;color:#667eea;font-size:1.1em}.settings-panel hr{border:none;border-top:1px solid #ddd;margin:20px 0}.setting-group{margin-bottom:25px}.toggle-label{display:flex;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none}.toggle-label input[type=checkbox]{width:50px;height:26px;margin-right:15px;cursor:pointer}.toggle-text{color:#333;font-size:1em}.setting-group label{display:block;color:#333;font-weight:600;margin-bottom:10px}.setting-group input[type=range]{width:100%;margin-bottom:5px}.setting-group small{color:#666;font-size:.85em}#density-value{color:#667eea;font-weight:700}.challenge-container{text-align:center}.challenge-screen .subtitle{margin-bottom:25px}.name-input{width:100%;max-width:320px;padding:14px 18px;font-size:1.1em;border:2px solid #ddd;border-radius:10px;margin-bottom:15px;text-align:center}.name-input:focus{outline:none;border-color:#667eea}.challenge-button{display:inline-block;padding:14px 40px;font-size:1.1em;font-weight:600;color:#fff;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:10px;cursor:pointer;transition:transform .2s}.challenge-button:hover{transform:translateY(-2px)}.challenge-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.challenge-button-secondary{background:#999;margin-top:20px}.challenge-error{color:#d9534f;margin-top:10px;min-height:1.2em}.challenge-status{display:flex;justify-content:center;align-items:baseline;gap:20px;margin-bottom:10px}.challenge-progress{font-weight:700;color:#667eea;font-size:1.2em}.challenge-timer{font-weight:700;color:#999;font-size:1em;font-family:Courier New,monospace}.target-emoji{position:absolute;bottom:10px;right:10px;font-size:3.5em;line-height:1;background:#ffffffe6;border-radius:50%;width:1.6em;height:1.6em;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px #0000004d}.flash-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#4cd964;opacity:0;pointer-events:none}.flash-overlay.flash{animation:challenge-flash .4s ease-out}@keyframes challenge-flash{0%{opacity:.7}to{opacity:0}}.hold-bar{max-width:640px;margin:0 auto 20px;height:16px;background:#e0e0e0;border-radius:8px;overflow:hidden}.hold-bar-fill{height:100%;width:0%;background:linear-gradient(90deg,#667eea,#764ba2);transition:width .1s linear}.result-time{font-size:3em;font-weight:700;color:#667eea;margin:10px 0}.overview-container{max-width:1100px}.overview-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;text-align:left}.overview-qr-panel{text-align:center}#qr-code img{width:100%;max-width:320px;border-radius:10px}.overview-counter{font-size:1.3em;font-weight:700;color:#667eea;margin:15px 0}.name-cloud{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.name-chip{background:#f0f0ff;color:#667eea;padding:6px 14px;border-radius:20px;font-size:.9em;font-weight:600}.leaderboard-list{list-style:none;padding:0}.leaderboard-list li{display:grid;grid-template-columns:2.2em 1fr auto;align-items:baseline;gap:10px;padding:8px 0;border-bottom:1px solid #eee;font-size:1.05em}.leaderboard-rank{font-family:Courier New,monospace;color:#999;font-weight:700}.leaderboard-time{color:#667eea;font-weight:700;font-family:Courier New,monospace;text-align:right;font-variant-numeric:tabular-nums}.overview-leaderboard-panel h2{display:flex;justify-content:space-between;align-items:center;gap:10px}.reset-button{padding:6px 14px;font-size:.55em;font-weight:600;color:#999;background:none;border:1px solid #ccc;border-radius:20px;cursor:pointer}.reset-button:hover{color:#d9534f;border-color:#d9534f}@media (max-width: 768px){.overview-grid{grid-template-columns:1fr}}@media (max-width: 768px){body{padding:10px}.container{padding:20px 15px}h1{font-size:2em;margin-bottom:5px}.subtitle{font-size:1em;margin-bottom:20px}.video-container{margin-bottom:20px}.emoji-icon{font-size:2.5em}.emoji-item{min-width:90px;min-height:150px;padding:15px 10px}.emoji-list{gap:15px}.emoji-results h2{font-size:1.2em;margin-bottom:15px}.settings-panel{width:280px;padding:70px 20px 20px}.settings-panel h3{font-size:1.3em}.qr-button{width:45px;height:45px;font-size:1.3em;top:15px;left:15px}.burger-menu{top:15px;right:15px;width:35px;height:30px}.qr-modal-content{margin:20px;padding:30px 20px;max-width:90%}.stats-overlay{font-size:.85em;padding:8px 10px}.expression-bars{padding:15px}}