.emomap{--bg-primary: #0a0a1a;--bg-secondary: #12122a;--text-primary: #ffffff;--text-secondary: rgba(255, 255, 255, .72);--accent-cyan: #00d4ff;--accent-pink: #ff69b4;--accent-red: #ff4444;--border-color: rgba(255, 255, 255, .12);--shadow-glow: 0 0 20px rgba(0, 212, 255, .3);position:relative;display:flex;flex-direction:column;min-height:max(620px,calc(100vh - 170px));border-radius:24px;overflow:hidden;background:radial-gradient(circle at 20% 0%,#131a3d,#090b1c 55%,#070913);color:var(--text-primary);font-family:Manrope,Trebuchet MS,sans-serif;box-shadow:0 20px 35px #04121e47}.emomap *{box-sizing:border-box;-webkit-tap-highlight-color:transparent}.emomap__header{padding:15px 20px;background:linear-gradient(180deg,rgba(18,18,42,.95) 0%,rgba(18,18,42,.55) 65%,transparent 100%);z-index:20;position:relative}.emomap__header h1{margin:0 0 15px;font-size:1.4rem;font-weight:700;text-align:center;letter-spacing:.01em;background:linear-gradient(90deg,var(--accent-cyan),var(--accent-pink));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.emomap__toolbar{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.emomap .toolbar-btn{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 14px;background:#ffffff0d;border:1px solid var(--border-color);border-radius:12px;color:var(--text-secondary);font-size:.7rem;cursor:pointer;transition:all .2s ease}.emomap .toolbar-btn svg{width:22px;height:22px}.emomap .toolbar-btn:hover,.emomap .toolbar-btn:active,.emomap .toolbar-btn.active{background:#00d4ff26;border-color:var(--accent-cyan);color:var(--accent-cyan);box-shadow:var(--shadow-glow)}.emomap__canvas{flex:1;position:relative;overflow:hidden;min-height:500px}.emomap #starfield,.emomap #emotions-canvas,.emomap #heatmap-canvas{position:absolute;inset:0;width:100%;height:100%}.emomap #starfield{z-index:1}.emomap #emotions-canvas{z-index:2}.emomap #heatmap-canvas{z-index:3;opacity:0;transition:opacity .4s ease;pointer-events:none}.emomap #heatmap-canvas.visible{opacity:.7}.emomap .quadrant-label{position:absolute;padding:8px 12px;font-size:.64rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:#ffffff75;pointer-events:none;z-index:10}.emomap .quadrant-label.top-left{top:10px;left:10px}.emomap .quadrant-label.top-right{top:10px;right:10px;text-align:right}.emomap .quadrant-label.bottom-left{bottom:10px;left:10px}.emomap .quadrant-label.bottom-right{bottom:10px;right:10px;text-align:right}.emomap .axis-label{position:absolute;font-size:.6rem;color:#ffffff54;pointer-events:none;z-index:10}.emomap .axis-label.x-axis{bottom:50%;right:15px;transform:translateY(50%)}.emomap .axis-label.y-axis{left:50%;top:15px;transform:translate(-50%) rotate(-90deg);transform-origin:center}.emomap #tooltip{position:fixed;padding:12px 16px;background:#12122af5;border:1px solid var(--accent-cyan);border-radius:12px;box-shadow:var(--shadow-glow);z-index:2000;pointer-events:none;transition:opacity .2s ease}.emomap #tooltip.hidden{opacity:0}.emomap .tooltip-name{font-size:1rem;font-weight:600;margin-bottom:4px}.emomap .tooltip-count{font-size:.8rem;color:var(--text-secondary)}.emomap .modal{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:2100;opacity:1;transition:opacity .25s ease}.emomap .modal.hidden{opacity:0;pointer-events:none}.emomap .modal-content{width:min(92%,540px);max-height:82vh;background:var(--bg-secondary);border-radius:20px;border:1px solid var(--border-color);overflow:hidden;display:flex;flex-direction:column}.emomap .modal-header{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 20px;border-bottom:1px solid var(--border-color)}.emomap .modal-header h2{margin:0;font-size:1.18rem;font-weight:600}.emomap .close-btn{width:36px;height:36px;border:none;background:#ffffff1a;color:var(--text-primary);font-size:1.5rem;border-radius:50%;cursor:pointer;transition:all .2s ease}.emomap .close-btn:hover{background:#ff44444d}.emomap #modal-body{padding:20px;overflow-y:auto;flex:1}.emomap .history-item,.emomap .stats-item{display:flex;align-items:center;gap:12px;padding:12px;background:#ffffff08;border-radius:12px;margin-bottom:10px}.emomap .history-item:last-child,.emomap .stats-item:last-child{margin-bottom:0}.emomap .history-color{width:12px;height:12px;border-radius:50%;box-shadow:0 0 10px currentColor}.emomap .history-info{flex:1}.emomap .history-name{font-weight:600;margin-bottom:2px}.emomap .history-date{font-size:.75rem;color:var(--text-secondary)}.emomap .history-delete{width:30px;height:30px;border:none;background:#f443;color:#ff7373;border-radius:50%;cursor:pointer;font-size:1rem}.emomap .stats-bar-container{flex:1;height:8px;background:#ffffff1a;border-radius:4px;overflow:hidden}.emomap .stats-bar{height:100%;border-radius:4px;transition:width .45s ease}.emomap .stats-count{font-size:.9rem;font-weight:600;min-width:30px;text-align:right}.emomap .empty-state{text-align:center;padding:40px 20px;color:var(--text-secondary)}.emomap .empty-state svg{width:60px;height:60px;margin-bottom:15px;opacity:.5}@keyframes emomapPulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.5}to{transform:scale(2);opacity:0}}.emomap .selection-pulse{position:fixed;border-radius:50%;pointer-events:none;animation:emomapPulse .6s ease-out forwards;z-index:1500}.emomap .confirm-dialog{position:fixed;inset:0;background:#0000009e;display:flex;align-items:center;justify-content:center;z-index:2200;opacity:1;transition:opacity .25s ease;backdrop-filter:blur(5px)}.emomap .confirm-dialog.hidden{opacity:0;pointer-events:none}.emomap .confirm-content{background:linear-gradient(145deg,#191937fa,#0f0f23fa);border:1px solid rgba(255,255,255,.15);border-radius:24px;padding:28px 36px;text-align:center;box-shadow:0 20px 60px #00000080,0 0 40px #00d4ff29;transform:scale(1);transition:transform .25s ease;min-width:260px}.emomap .confirm-dialog.hidden .confirm-content{transform:scale(.85)}.emomap .confirm-emoji{width:70px;height:70px;margin:0 auto 16px;border-radius:50%;display:flex;align-items:center;justify-content:center;position:relative}.emomap .confirm-emoji:before{content:"";position:absolute;width:100%;height:100%;border-radius:50%;animation:emomapConfirmGlow 1.5s ease-in-out infinite}@keyframes emomapConfirmGlow{0%,to{transform:scale(1);opacity:.5}50%{transform:scale(1.3);opacity:.2}}.emomap .confirm-emoji:after{content:"";width:24px;height:24px;background:currentColor;border-radius:50%;box-shadow:0 0 20px currentColor,0 0 40px currentColor}.emomap .confirm-name{font-size:1.4rem;font-weight:700;margin-bottom:8px}.emomap .confirm-question{font-size:.92rem;color:#ffffffad;margin-bottom:24px}.emomap .confirm-buttons{display:flex;gap:12px;justify-content:center}.emomap .confirm-btn{padding:12px 28px;border:none;border-radius:14px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s ease;font-family:inherit}.emomap .confirm-btn.cancel{background:#ffffff14;color:#ffffffb3;border:1px solid rgba(255,255,255,.1)}.emomap .confirm-btn.cancel:hover,.emomap .confirm-btn.cancel:active{background:#ffffff26;color:#fff}.emomap .confirm-btn.ok{background:linear-gradient(135deg,var(--accent-cyan),#00a8cc);color:#fff;box-shadow:0 4px 20px #00d4ff4d}.emomap .confirm-btn.ok:hover,.emomap .confirm-btn.ok:active{transform:scale(1.05);box-shadow:0 6px 25px #00d4ff66}@media(max-width:700px){.emomap{min-height:max(580px,calc(100vh - 120px));border-radius:18px}.emomap__header{padding:12px}.emomap__header h1{font-size:1.2rem;margin-bottom:11px}.emomap .toolbar-btn{padding:8px 10px}.emomap .toolbar-btn svg{width:18px;height:18px}.emomap .toolbar-btn span{font-size:.62rem}.emomap .confirm-content{width:min(92%,360px);padding:22px 16px}}
