.game-card{background:white;border-radius:15px;padding:20px;box-shadow:0 4px 15px #0000001a;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden}.game-card:hover{transform:translateY(-5px);box-shadow:0 10px 30px #0003}.game-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%)}.award-badge{position:absolute;top:15px;right:15px;background:linear-gradient(135deg,#fbbf24 0%,#f59e0b 100%);color:#fff;padding:6px 12px;border-radius:20px;font-size:12px;display:flex;align-items:center;gap:5px;box-shadow:0 2px 8px #fbbf2466}.game-card-header{margin-bottom:15px}.game-title{font-size:18px;color:#1e293b;margin-bottom:5px;line-height:1.3;padding-right:60px}.game-subtitle{font-size:13px;color:#64748b;font-style:italic;margin-bottom:5px}.game-publisher{font-size:12px;color:#94a3b8}.game-genre{display:inline-block;background:#f1f5f9;color:#475569;padding:6px 12px;border-radius:20px;font-size:12px;font-weight:500;margin-bottom:15px}.game-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:15px;padding:15px;background:#f8fafc;border-radius:10px}.stat-item{display:flex;align-items:center;gap:8px;font-size:14px;color:#475569}.stat-item svg{color:#667eea}.complexity-badge{padding:2px 8px;border-radius:12px;font-size:11px;font-weight:600}.complexity-bars{display:flex;flex-direction:column;gap:10px;margin-bottom:15px}.complexity-bar{display:grid;grid-template-columns:70px 1fr 80px;align-items:center;gap:8px;font-size:11px}.bar-label{color:#64748b;white-space:nowrap}.bar-track{height:6px;background:#e2e8f0;border-radius:3px;overflow:hidden}.bar-fill{height:100%;border-radius:3px;transition:width .3s ease}.click-hint{text-align:center;font-size:12px;color:#94a3b8;padding-top:10px;border-top:1px solid #e2e8f0;opacity:0;transition:opacity .3s}.game-card:hover .click-hint{opacity:1}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.7);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:flex;justify-content:center;align-items:center;z-index:1000;padding:20px;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background:white;border-radius:20px;padding:30px;max-width:800px;width:100%;max-height:90vh;overflow-y:auto;position:relative;box-shadow:0 20px 60px #0000004d;animation:slideUp .3s ease}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.modal-close{position:absolute;top:20px;right:20px;background:#f1f5f9;border:none;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;z-index:10}.modal-close:hover{background:#e2e8f0;transform:rotate(90deg)}.modal-header{display:flex;justify-content:space-between;align-items:start;margin-bottom:30px;padding-right:50px}.modal-title{font-size:28px;color:#1e293b;margin-bottom:8px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.modal-subtitle{font-size:16px;color:#64748b;font-style:italic;margin-bottom:8px}.modal-publisher{font-size:14px;color:#94a3b8}.modal-award{display:flex;align-items:center;gap:8px;background:linear-gradient(135deg,#fbbf24 0%,#f59e0b 100%);color:#fff;padding:10px 16px;border-radius:25px;font-size:14px;font-weight:600;white-space:nowrap;box-shadow:0 4px 12px #fbbf2466}.modal-section{margin-bottom:30px;padding-bottom:30px;border-bottom:2px solid #f1f5f9}.modal-section:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.modal-section h3{font-size:18px;color:#1e293b;margin-bottom:20px}.info-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.info-item{display:flex;gap:12px;align-items:start}.info-item svg{color:#667eea;flex-shrink:0;margin-top:2px}.info-label{display:block;font-size:12px;color:#94a3b8;margin-bottom:4px}.info-value{display:block;font-size:16px;color:#1e293b;font-weight:600}.info-hint{display:block;font-size:11px;color:#64748b;margin-top:2px}.bgg-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.bgg-stat{text-align:center;padding:20px;background:#f8fafc;border-radius:12px}.bgg-stat-value{font-size:28px;font-weight:700;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:8px}.bgg-stat-label{font-size:12px;color:#64748b;text-transform:uppercase;letter-spacing:.5px}.complexity-slider-group{margin-bottom:25px}.slider-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:14px;color:#475569;font-weight:600}.slider-value{color:#667eea;font-weight:700}.slider-track{height:12px;background:#e2e8f0;border-radius:6px;overflow:hidden;margin-bottom:8px}.slider-fill{height:100%;border-radius:6px;transition:width .3s ease;box-shadow:inset 0 2px 4px #0000001a}.slider-labels{display:flex;justify-content:space-between;font-size:11px;color:#94a3b8}.bgg-link{display:inline-flex;align-items:center;gap:8px;padding:12px 20px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;text-decoration:none;border-radius:10px;font-weight:600;transition:all .2s;margin-bottom:15px}.bgg-link:hover{transform:translateY(-2px);box-shadow:0 8px 20px #667eea66}.notes{background:#fffbeb;border-left:4px solid #f59e0b;padding:15px;border-radius:8px}.notes strong{display:block;margin-bottom:8px;color:#92400e}.notes p{color:#78350f;line-height:1.6}@media (max-width: 768px){.modal-content{padding:20px;max-height:95vh}.modal-header{flex-direction:column;gap:15px}.modal-title{font-size:22px}.modal-award{align-self:flex-start}.info-grid,.bgg-stats{grid-template-columns:1fr;gap:15px}}.game-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}.no-results{grid-column:1 / -1;text-align:center;padding:80px 20px;background:rgba(255,255,255,.95);border-radius:15px;box-shadow:0 10px 30px #0000001a}.no-results-icon{font-size:80px;margin-bottom:20px;opacity:.5}.no-results h2{font-size:24px;color:#1e293b;margin-bottom:10px}.no-results p{color:#64748b;font-size:16px}@media (max-width: 768px){.game-grid{grid-template-columns:1fr;gap:15px}}.filter-panel{background:rgba(255,255,255,.95);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:15px;padding:25px;box-shadow:0 10px 30px #0000001a;position:sticky;top:20px;max-height:calc(100vh - 40px);overflow-y:auto}.filter-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px;padding-bottom:15px;border-bottom:2px solid #e2e8f0}.filter-header h2{font-size:20px;color:#1e293b}.reset-btn{background:#f1f5f9;border:none;padding:8px 16px;border-radius:8px;font-size:12px;color:#64748b;cursor:pointer;transition:all .2s}.reset-btn:hover{background:#e2e8f0;color:#1e293b}.filter-group{margin-bottom:20px}.filter-group label{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:#475569;margin-bottom:8px}.search-input,.filter-group select{width:100%;padding:10px 12px;border:2px solid #e2e8f0;border-radius:8px;font-size:14px;transition:all .2s;background:white}.search-input:focus,.filter-group select:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.rating-slider{width:100%;height:6px;border-radius:3px;background:#e2e8f0;outline:none;-webkit-appearance:none}.rating-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);cursor:pointer;box-shadow:0 2px 8px #0003}.rating-slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);cursor:pointer;border:none;box-shadow:0 2px 8px #0003}.rating-labels{display:flex;justify-content:space-between;font-size:11px;color:#94a3b8;margin-top:5px}@media (max-width: 1024px){.filter-panel{position:static;max-height:none}}.chatbot-container{position:fixed;bottom:100px;right:30px;width:400px;height:600px;background:white;border-radius:20px;box-shadow:0 20px 60px #0000004d;display:flex;flex-direction:column;z-index:998;animation:slideIn .3s ease}@keyframes slideIn{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.chatbot-header{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;padding:20px;border-radius:20px 20px 0 0;display:flex;justify-content:space-between;align-items:center}.chatbot-header-title{display:flex;align-items:center;gap:12px}.chatbot-header-title h3{font-size:16px;margin:0}.chatbot-header-title p{font-size:11px;opacity:.9;margin:0}.sparkle-icon{animation:sparkle 2s ease-in-out infinite}@keyframes sparkle{0%,to{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.2)}}.chatbot-messages{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:15px}.message{display:flex;gap:10px;animation:messageSlide .3s ease}@keyframes messageSlide{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.message.user{flex-direction:row-reverse}.message-avatar{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}.message.assistant .message-avatar{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff}.message.user .message-avatar{background:#e2e8f0;color:#475569}.message-content{max-width:75%;padding:12px 16px;border-radius:18px;line-height:1.5;font-size:14px;white-space:pre-wrap}.message.assistant .message-content{background:#f1f5f9;color:#1e293b;border-bottom-left-radius:4px}.message.user .message-content{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;border-bottom-right-radius:4px}.typing-indicator{display:flex;gap:4px;padding:5px}.typing-indicator span{width:8px;height:8px;border-radius:50%;background:#94a3b8;animation:typing 1.4s ease-in-out infinite}.typing-indicator span:nth-child(2){animation-delay:.2s}.typing-indicator span:nth-child(3){animation-delay:.4s}@keyframes typing{0%,60%,to{transform:translateY(0)}30%{transform:translateY(-10px)}}.quick-prompts{padding:15px 20px;border-top:1px solid #e2e8f0}.quick-prompts p{font-size:12px;color:#64748b;margin-bottom:10px}.prompt-buttons{display:flex;flex-direction:column;gap:8px}.prompt-button{background:#f8fafc;border:1px solid #e2e8f0;padding:10px 14px;border-radius:10px;font-size:13px;color:#475569;cursor:pointer;transition:all .2s;text-align:left}.prompt-button:hover{background:#f1f5f9;border-color:#667eea;color:#667eea;transform:translate(5px)}.chatbot-input-form{display:flex;gap:10px;padding:20px;border-top:1px solid #e2e8f0;background:white;border-radius:0 0 20px 20px}.chatbot-input{flex:1;padding:12px 16px;border:2px solid #e2e8f0;border-radius:25px;font-size:14px;outline:none;transition:all .2s}.chatbot-input:focus{border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.chatbot-input:disabled{background:#f8fafc;cursor:not-allowed}.chatbot-send-btn{width:44px;height:44px;border-radius:50%;border:none;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;flex-shrink:0}.chatbot-send-btn:hover:not(:disabled){transform:scale(1.1);box-shadow:0 5px 15px #667eea66}.chatbot-send-btn:disabled{opacity:.5;cursor:not-allowed}.spinning{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 768px){.chatbot-container{bottom:80px;right:15px;left:15px;width:auto;height:500px}}.header{background:rgba(255,255,255,.95);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:30px 0;box-shadow:0 4px 20px #0000001a;margin-bottom:30px}.header-content{max-width:1600px;margin:0 auto;padding:0 20px;display:flex;justify-content:space-between;align-items:center}.header-title h1{font-size:32px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:5px}.subtitle{color:#64748b;font-size:14px}.header-stats{display:flex;gap:30px}.stat{text-align:center}.stat-value{display:block;font-size:28px;font-weight:700;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.stat-label{display:block;font-size:12px;color:#64748b;margin-top:5px}@media (max-width: 768px){.header-content{flex-direction:column;gap:20px;text-align:center}.header-title h1{font-size:24px}.header-stats{gap:20px}.stat-value{font-size:24px}}.app{min-height:100vh;padding-bottom:80px}.app-container{max-width:1600px;margin:0 auto;padding:20px;display:grid;grid-template-columns:300px 1fr;gap:30px}.chat-toggle{position:fixed;bottom:30px;right:30px;width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;color:#fff;font-size:28px;cursor:pointer;box-shadow:0 10px 30px #0000004d;transition:all .3s ease;z-index:999}.chat-toggle:hover{transform:scale(1.1);box-shadow:0 15px 40px #0006}.chat-toggle:active{transform:scale(.95)}@media (max-width: 1024px){.app-container{grid-template-columns:1fr;gap:20px}}@media (max-width: 768px){.app-container{padding:15px}.chat-toggle{bottom:20px;right:20px;width:50px;height:50px;font-size:24px}}*{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 0%,#764ba2 100%);min-height:100vh;color:#333}#root{min-height:100vh}:root{--primary: #667eea;--secondary: #764ba2;--success: #10b981;--warning: #f59e0b;--danger: #ef4444;--info: #3b82f6;--bg-light: #f8fafc;--bg-dark: #1e293b;--text-light: #64748b;--text-dark: #0f172a;--border: #e2e8f0}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:rgba(255,255,255,.1)}::-webkit-scrollbar-thumb{background:rgba(255,255,255,.3);border-radius:5px}::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.5)}