*{box-sizing:border-box;margin:0;padding:0}:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh;overflow-x:hidden}#root,.app{width:100%;min-height:100vh}h1,h2,h3,h4,h5,h6{margin:0;font-weight:600}a{font-weight:500;color:#646cff;text-decoration:inherit;transition:color .2s ease}a:hover{color:#535bf2}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:all .25s ease}button:hover{border-color:#646cff;transform:translateY(-2px)}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9;color:#213547}button:hover{background-color:#e9e9e9}}.welcome-container{display:flex;justify-content:center;align-items:center;min-height:100vh;padding:2rem;background:linear-gradient(135deg,#667eea,#764ba2);position:relative;overflow:hidden}.musical-notes{position:absolute;width:100%;height:100%;top:0;left:0;pointer-events:none;z-index:0}.note{position:absolute;font-size:2.5rem;color:#fff3;animation:floatNote 15s infinite ease-in-out}.note-1{top:10%;left:10%;animation-delay:0s}.note-2{top:20%;left:80%;animation-delay:2s;font-size:2rem}.note-3{top:60%;left:15%;animation-delay:4s;font-size:3rem}.note-4{top:70%;left:85%;animation-delay:1s;font-size:2.2rem}.note-5{top:30%;left:5%;animation-delay:5s;font-size:2.8rem}.note-6{top:80%;left:70%;animation-delay:3s;font-size:2.3rem}.note-7{top:50%;left:90%;animation-delay:6s;font-size:2.6rem}.note-8{top:15%;left:50%;animation-delay:7s;font-size:2.4rem}@keyframes floatNote{0%,to{transform:translateY(0) rotate(0);opacity:.2}25%{transform:translateY(-30px) rotate(10deg);opacity:.4}50%{transform:translateY(-60px) rotate(-10deg);opacity:.3}75%{transform:translateY(-30px) rotate(5deg);opacity:.4}}.vinyl-record{position:absolute;border-radius:50%;border:8px solid rgba(255,255,255,.1);pointer-events:none;z-index:0;animation:rotateVinyl 20s linear infinite}.vinyl-1{width:120px;height:120px;top:15%;right:10%;background:radial-gradient(circle at center,rgba(255,255,255,.05) 0%,transparent 70%),repeating-conic-gradient(from 0deg,rgba(255,255,255,.03) 0deg 2deg,transparent 2deg 4deg)}.vinyl-2{width:80px;height:80px;bottom:20%;left:8%;background:radial-gradient(circle at center,rgba(255,255,255,.05) 0%,transparent 70%),repeating-conic-gradient(from 0deg,rgba(255,255,255,.03) 0deg 2deg,transparent 2deg 4deg);animation-duration:15s;animation-direction:reverse}@keyframes rotateVinyl{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.welcome-content{text-align:center;max-width:600px;padding:3rem;background:#fffffff2;border-radius:20px;box-shadow:0 20px 60px #0000004d;animation:fadeIn .6s ease-in;position:relative;z-index:1}.title-icon{font-size:4rem;margin-bottom:.5rem;animation:pulse 2s ease-in-out infinite;display:inline-block}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.welcome-title{font-size:3.5rem;font-weight:700;margin-bottom:1rem;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.welcome-subtitle{font-size:1.5rem;color:#555;margin-bottom:2rem;font-weight:500}.welcome-description{font-size:1.1rem;color:#666;line-height:1.8}.welcome-description p{margin:.5rem 0}@media(prefers-color-scheme:dark){.welcome-content{background:#1e1e1ef2}.welcome-subtitle{color:#ccc}.welcome-description{color:#aaa}}.welcome-buttons{margin-top:2rem;display:flex;flex-direction:column;gap:1rem;align-items:center}.play-button{padding:1rem 3rem;font-size:1.2rem;font-weight:600;color:#fff;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:50px;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 15px #667eea66;width:100%;max-width:300px;display:flex;align-items:center;justify-content:center;gap:.5rem}.play-icon{font-size:1rem;display:inline-block;transition:transform .2s}.play-button:hover .play-icon{transform:translate(3px)}.play-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea99}.play-button:active{transform:translateY(0)}.statistics-button{padding:.75rem 2rem;font-size:1rem;font-weight:600;color:#667eea;background:#fff;border:2px solid #667eea;border-radius:50px;cursor:pointer;transition:all .2s;width:100%;max-width:300px}.statistics-button:hover{background:#667eea;color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px #667eea4d}.statistics-button:active{transform:translateY(0)}.help-button{padding:.75rem 2rem;font-size:1rem;font-weight:600;color:#667eea;background:#fff;border:2px solid #667eea;border-radius:50px;cursor:pointer;transition:all .2s;width:100%;max-width:300px}.help-button:hover{background:#667eea;color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px #667eea4d}.help-button:active{transform:translateY(0)}.archive-button{padding:.75rem 2rem;font-size:1rem;font-weight:600;color:#667eea;background:#fff;border:2px solid #667eea;border-radius:50px;cursor:pointer;transition:all .2s;width:100%;max-width:300px}.archive-button:hover{background:#667eea;color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px #667eea4d}.archive-button:active{transform:translateY(0)}@media(max-width:768px){.welcome-title{font-size:2.5rem}.welcome-subtitle{font-size:1.2rem}.welcome-content{padding:2rem}.title-icon{font-size:3rem}.note{font-size:1.5rem}.vinyl-1{width:80px;height:80px}.vinyl-2{width:60px;height:60px}}.guess-box{background:#fff;border-radius:12px;padding:1.5rem;margin-bottom:1rem;box-shadow:0 2px 8px #0000001a;text-align:left;position:relative;transform-origin:center}.guess-box.win-pulse{animation:pulseWin .6s ease-in-out;animation-iteration-count:7}.guess-box.win-pulse[data-pulse-delay]{animation-delay:var(--pulse-delay)}@keyframes pulseWin{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.guess-number-badge{position:absolute;top:.5rem;right:.5rem;font-size:.65rem;color:#999;font-weight:500}.guess-box-header{margin-bottom:1rem}.guess-song-title{font-size:1rem;font-weight:600;color:#333;margin:0}.guess-clues{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;position:relative;z-index:0}@media(max-width:768px){.guess-box{padding:1rem}.guess-song-title{font-size:.9rem;padding-right:3rem}.guess-clues{gap:.35rem;flex-wrap:wrap;align-items:center}.clue-tag{padding:.35rem .25rem;font-size:.75rem;gap:.15rem;flex:0 0 calc(50% - .2rem);min-width:calc(50% - .2rem);max-width:calc(50% - .2rem);min-height:28px;line-height:1.2;overflow:hidden;box-sizing:border-box}.clue-tag.country-clue .clue-value,.clue-tag.country-clue .clue-arrow{font-size:.7rem}.clue-label{font-size:.8rem;white-space:nowrap}.clue-value{font-size:.75rem;white-space:nowrap;flex-shrink:1;min-width:0;overflow:hidden;text-overflow:ellipsis;max-width:100%}.clue-arrow{font-size:.8rem;margin-left:.08rem}.clue-tooltip-wrapper{margin-left:.1rem}.artist-type-icon{width:14px;height:14px}.duration-icon,.country-icon,.year-icon{width:12px;height:12px}.clue-icon{font-size:.75rem}.clue-help-icon{font-size:.65rem;margin-left:.2rem}.clue-help-button{width:12px;height:12px;flex-shrink:0}}.clue-tag{display:flex;align-items:center;gap:.2rem;padding:.4rem;background:#f0f0f0;border-radius:20px;font-size:.8rem;transition:all .2s ease;box-shadow:0 2px 4px #0000001a;border:1px solid rgba(0,0,0,.1);flex-shrink:0;max-width:100%;min-height:32px;line-height:1.2;position:relative;z-index:1;overflow:hidden;box-sizing:border-box}.clue-tag.clue-status-correct{background:linear-gradient(to bottom,#d4edda,#c3e6cb);border:1px solid #a3d5a3;box-shadow:0 3px 6px #22c55e33,inset 0 1px #ffffff4d}.clue-tag.clue-status-close{background:linear-gradient(to bottom,#cfe2ff,#b6d4fe);border:1px solid #9ec5fe;box-shadow:0 3px 6px #0d6efd33,inset 0 1px #ffffff4d}.clue-tag.clue-status-incorrect{background:linear-gradient(to bottom,#f8d7da,#f1aeb5);border:1px solid #ea868f;box-shadow:0 3px 6px #dc35454d,inset 0 1px #fff3}.clue-tag.clue-status-neighboring{background:linear-gradient(to bottom,#fef3c7,#fde68a);border:1px solid #fcd34d;box-shadow:0 3px 6px #f59e0b4d,inset 0 1px #ffffff4d}.clue-tag.clue-status-unknown{background:linear-gradient(to bottom,#f0f0f0,#e0e0e0);border:1px solid #d0d0d0;box-shadow:0 2px 4px #0000001a,inset 0 1px #ffffff4d}.clue-label{font-weight:600;color:#666;font-size:.85rem;text-transform:uppercase;display:inline-flex;align-items:center;flex-shrink:0}.clue-value{color:#333;font-weight:500;font-size:.8rem;display:inline-flex;align-items:center;white-space:nowrap;flex-shrink:1;min-width:0;overflow:hidden;text-overflow:ellipsis;max-width:fit-content}.clue-value.neighboring{color:#f59e0b;font-weight:600;font-style:italic}.clue-value-checkmark{font-size:1rem;font-weight:600;line-height:1}.clue-arrow{margin-left:.08rem;margin-right:0;font-size:.8rem;font-weight:700;line-height:1;flex-shrink:0;white-space:nowrap}.artist-type-icon-wrapper{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.artist-type-icon{width:16px;height:16px;color:#22c55e;vertical-align:middle}.genre-icon-wrapper{display:inline-flex;align-items:center;justify-content:center;font-size:.9rem;flex-shrink:0;line-height:1}.year-icon-wrapper,.duration-icon-wrapper,.country-icon-wrapper,.gender-icon-wrapper{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.year-icon,.duration-icon,.country-icon{width:14px;height:14px;color:#666;vertical-align:middle;flex-shrink:0}.gender-icon{font-size:14px;line-height:1;color:#666;vertical-align:middle;flex-shrink:0;display:inline-block}.clue-icon{margin-left:.4rem;font-weight:700;font-size:.9rem;display:inline-block}.clue-icon.correct{color:#22c55e}.clue-icon.incorrect{color:#ef4444}.clue-tooltip-wrapper{position:relative;display:inline-flex;align-items:center;margin-left:auto;flex-shrink:0;z-index:10001;isolation:isolate}.clue-help-button{background:none;border:none;padding:0;margin:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;color:#667eea;opacity:.7;transition:all .2s ease;width:16px;height:16px;flex-shrink:0;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.clue-help-button:hover{opacity:1;transform:scale(1.1)}.clue-help-button:active{transform:scale(.95)}.clue-help-button svg{width:100%;height:100%;display:block}.clue-tooltip{position:fixed;padding:.75rem 1rem;background:#333;color:#fff;border-radius:8px;font-size:.8rem;line-height:1.5;max-width:min(280px,calc(100vw - 20px));min-width:200px;white-space:normal;word-wrap:break-word;z-index:99999;box-shadow:0 4px 12px #0000004d;pointer-events:auto;text-align:left;top:-9999px;left:0;opacity:0;visibility:hidden;-webkit-transform:translateZ(0);transform:translateZ(0);will-change:transform;touch-action:none}.clue-tooltip-arrow{position:absolute;top:100%;border:6px solid transparent;border-top-color:#333;pointer-events:none}@media(max-width:768px){.clue-tooltip{max-width:240px;min-width:180px;font-size:.75rem;padding:.65rem .85rem}.clue-tooltip-arrow{border-width:5px}.clue-help-button{width:14px;height:14px}}@media(prefers-color-scheme:dark){.guess-box{background:#282828f2}.guess-song-title{color:#fff}.guess-number-badge{color:#aaa}.clue-tag{background:#3c3c3ccc}.clue-label{color:#aaa}.clue-value{color:#fff}}.win-confetti-container{position:fixed;inset:0;pointer-events:none;z-index:1000;overflow:hidden}.confetti-note{position:absolute;top:50%;left:50%;font-size:2rem;color:#667eea;font-weight:700;animation:confettiFall 4s ease-out forwards;animation-delay:var(--delay);transform-origin:center;opacity:0}@keyframes confettiFall{0%{opacity:1;transform:translate(-50%,-50%) scale(0) rotate(0)}10%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(calc(var(--rotation) * .3))}to{opacity:0;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(1.2) rotate(var(--rotation))}}@media(max-width:768px){.confetti-note{font-size:1.5rem}}.share-result-button{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;margin-top:1rem;font-size:1rem;font-weight:600;color:#fff;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:50px;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 15px #667eea66;position:relative;overflow:hidden;animation:magicGlow 2s ease-in-out infinite}.share-result-button:before{content:"";position:absolute;top:-30%;left:-100%;width:300%;height:160%;background:radial-gradient(circle 15px at 15% 20%,rgba(255,255,255,.5) 0%,transparent 50%),radial-gradient(circle 20px at 25% 35%,rgba(255,255,255,.4) 0%,transparent 55%),radial-gradient(circle 12px at 40% 15%,rgba(255,255,255,.45) 0%,transparent 50%),radial-gradient(circle 18px at 55% 40%,rgba(255,255,255,.35) 0%,transparent 60%),radial-gradient(circle 14px at 70% 25%,rgba(255,255,255,.4) 0%,transparent 52%),radial-gradient(circle 16px at 85% 45%,rgba(255,255,255,.3) 0%,transparent 58%),radial-gradient(circle 10px at 30% 60%,rgba(255,255,255,.25) 0%,transparent 48%),radial-gradient(circle 22px at 65% 70%,rgba(255,255,255,.2) 0%,transparent 62%);animation:windBlown 4s ease-in-out infinite;pointer-events:none;z-index:1;filter:blur(2px);transform:rotate(-15deg);transform-origin:center}@keyframes windBlown{0%{left:-100%;top:-30%;transform:rotate(-15deg) translateY(0)}25%{transform:rotate(-12deg) translateY(-5px)}50%{transform:rotate(-18deg) translateY(3px)}75%{transform:rotate(-14deg) translateY(-2px)}to{left:100%;top:30%;transform:rotate(-15deg) translateY(0)}}@keyframes magicGlow{0%,to{box-shadow:0 4px 15px #667eea66;transform:scale(1)}50%{box-shadow:0 4px 20px #667eea99;transform:scale(1.02)}}.share-result-button .sparkle{position:absolute;font-size:.6rem;color:#fffc;text-shadow:0 0 4px rgba(192,192,192,.6),0 0 8px rgba(255,255,255,.4);pointer-events:none;z-index:2;opacity:0}.share-result-button .sparkle-1{top:15%;left:15%;animation:sparkleFloat1 3s ease-in-out infinite}.share-result-button .sparkle-2{top:25%;right:20%;animation:sparkleFloat2 3s ease-in-out infinite .8s}.share-result-button .sparkle-3{bottom:20%;left:30%;animation:sparkleFloat3 3s ease-in-out infinite 1.6s}@keyframes sparkleFloat1{0%,to{opacity:0;transform:translateY(0) scale(.8) rotate(0)}20%{opacity:.6}50%{opacity:1;transform:translateY(-8px) scale(1) rotate(180deg)}80%{opacity:.6}}@keyframes sparkleFloat2{0%,to{opacity:0;transform:translateY(0) scale(.8) rotate(0)}20%{opacity:.5}50%{opacity:.9;transform:translateY(-6px) scale(1) rotate(-180deg)}80%{opacity:.5}}@keyframes sparkleFloat3{0%,to{opacity:0;transform:translateY(0) scale(.8) rotate(0)}20%{opacity:.4}50%{opacity:.8;transform:translateY(-7px) scale(1) rotate(180deg)}80%{opacity:.4}}.share-result-button:hover{transform:translateY(-2px) scale(1.05);box-shadow:0 6px 25px #667eeab3;animation:magicGlow 1s ease-in-out infinite}.share-result-button:hover:before{animation-duration:1.5s}.share-result-button:hover .sparkle{animation-duration:2s}.share-result-button:active{transform:translateY(0)}.share-icon{font-size:1.2rem;display:inline-block;position:relative;z-index:2}.share-result-button>span:not(.sparkle){position:relative;z-index:2}@media(max-width:768px){.share-result-button{padding:.6rem 1.2rem;font-size:.9rem;width:100%;justify-content:center}}.active-game-container{display:flex;justify-content:center;align-items:center;min-height:100vh;padding:2rem;background:linear-gradient(135deg,#667eea,#764ba2)}.active-game-content{text-align:center;max-width:600px;width:100%;padding:3rem;background:#fffffff2;border-radius:20px;box-shadow:0 20px 60px #0000004d;animation:fadeIn .6s ease-in}@keyframes fadeIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.game-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;gap:1rem;flex-wrap:wrap}.daily-song-title{font-size:2.5rem;font-weight:700;margin:0;color:#333;display:flex;align-items:center;justify-content:flex-start;gap:.5rem;flex:1 1 auto;min-width:200px}.header-buttons{display:flex;gap:.5rem;align-items:center;flex-shrink:0}.help-link-button,.statistics-link-button,.archive-link-button{padding:.5rem 1rem;font-size:.9rem;font-weight:600;color:#667eea;background:#fff;border:2px solid #667eea;border-radius:20px;cursor:pointer;transition:all .2s;white-space:nowrap}.help-link-button:hover,.statistics-link-button:hover,.archive-link-button:hover{background:#667eea;color:#fff;transform:translateY(-1px);box-shadow:0 2px 8px #667eea4d}.help-link-button:active,.statistics-link-button:active,.archive-link-button:active{transform:translateY(0)}.music-icon{font-size:2.5rem;color:#667eea}.guess-counter{font-size:1rem;color:#666;margin-bottom:2rem;font-weight:500}.search-container{display:flex;gap:1rem;align-items:center;justify-content:center;flex-wrap:wrap}.search-box-wrapper{position:relative;flex:1;min-width:250px;max-width:400px}.search-icon{position:absolute;left:1rem;top:50%;transform:translateY(-50%);font-size:1.2rem;color:#999;z-index:1;pointer-events:none}.mui-autocomplete,.autocomplete-input{width:100%}.action-buttons{display:flex;gap:.75rem;align-items:center}.submit-button{padding:1rem 2.5rem;font-size:1rem;font-weight:600;color:#fff;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:50px;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 15px #667eea66;white-space:nowrap}.give-up-button{padding:.6rem 1.2rem;font-size:.85rem;font-weight:500;color:#666;background:#c8c8c84d;border:1px solid rgba(150,150,150,.4);border-radius:20px;cursor:pointer;transition:all .2s;white-space:nowrap;opacity:.7}.give-up-button:hover:not(:disabled){opacity:.9;background:#c8c8c866;border-color:#96969680}.give-up-button:active:not(:disabled){opacity:.8;transform:scale(.98)}.give-up-button:disabled{opacity:.5;cursor:not-allowed}.submit-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea99}.submit-button:active{transform:translateY(0)}.submit-button:disabled{opacity:.6;cursor:not-allowed}.error-message{margin-top:1rem;padding:1rem;background:#fee;color:#c33;border-radius:8px;font-size:.9rem}.game-status-message{margin:1rem 0;padding:1rem;border-radius:8px;font-size:1.1rem;font-weight:600;text-align:center}.game-status-message.won{background:#d4edda;color:#155724;border:1px solid #c3e6cb}.game-status-message.lost{background:#f8d7da;color:#721c24;border:1px solid #f5c6cb}.solution-display{margin-top:.75rem;padding-top:.75rem;font-size:1rem;font-weight:500}.secret-song-details{margin-top:.75rem;padding:.5rem;background:#fff6;border-radius:6px;border:1px solid rgba(102,126,234,.1)}.secret-song-details-title{font-size:.75rem;font-weight:600;color:#666;margin:0 0 .4rem;text-align:left;text-transform:uppercase;letter-spacing:.3px}.secret-song-info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.35rem;margin-top:.35rem}.secret-song-info-item{display:flex;flex-direction:row;align-items:baseline;gap:.4rem;padding:.25rem .4rem;background:#fff3;border-radius:3px}.secret-song-label{font-size:.7rem;font-weight:500;color:#888;white-space:nowrap}.secret-song-value{font-size:.75rem;font-weight:500;color:#333;flex:1;text-align:left}.game-status-message .share-result-button{margin-top:1rem;margin-left:auto;margin-right:auto;display:block}.game-status-message.won .solution-display{border-top:1px solid rgba(21,87,36,.2)}.game-status-message.won .solution-display strong{font-weight:700;color:#155724}.game-status-message.lost .solution-display{border-top:1px solid rgba(114,28,36,.2)}.game-status-message.lost .solution-display strong{font-weight:700;color:#721c24}.guesses-container{margin-top:2rem;width:100%;display:flex;flex-direction:column;gap:1rem}@media(prefers-color-scheme:dark){.active-game-content{background:#1e1e1ef2}.daily-song-title{color:#fff}.guess-counter{color:#ccc}.search-input{background:#ffffff1a;border-color:#444;color:#fff}.search-input::placeholder{color:#999}.search-icon{color:#999}}@media(max-width:768px){.active-game-container{padding:.5rem}.active-game-content{padding:1.5rem;max-width:100%}.game-header{flex-direction:column;align-items:stretch;gap:.75rem}.daily-song-title,.music-icon{font-size:1.5rem}.header-buttons{flex-direction:row;gap:.3rem;flex-wrap:wrap;justify-content:center}.help-link-button,.statistics-link-button,.archive-link-button{width:auto;font-size:.7rem;padding:.3rem .6rem;white-space:nowrap}.search-container{flex-direction:column;width:100%;gap:.75rem}.search-box-wrapper{width:100%;max-width:100%;min-width:0}.submit-button{width:100%}}.statistics-page-container{min-height:100vh;display:flex;justify-content:center;align-items:flex-start;padding:2rem 1rem;background:linear-gradient(135deg,#667eea,#764ba2)}.statistics-page-content{width:100%;max-width:900px;background:#fff;border-radius:16px;box-shadow:0 10px 40px #0003;padding:2rem;position:relative}.statistics-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1rem;border-bottom:2px solid #f0f0f0}.statistics-title{font-size:2rem;font-weight:700;color:#333;margin:0}.close-button-top{background:#667eea1a;border:2px solid #667eea;color:#667eea;font-size:1.5rem;width:40px;height:40px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;line-height:1;font-weight:700}.close-button-top:hover{background:#667eea33;transform:scale(1.1);color:#764ba2;border-color:#764ba2}.statistics-loading,.statistics-error{text-align:center;padding:3rem 1rem;color:#666}.statistics-error{color:#ef4444}.statistics-content{display:flex;flex-direction:column;gap:2rem}.statistics-section{display:flex;flex-direction:column;gap:1rem}.section-title{font-size:1.5rem;font-weight:600;color:#333;margin:0;padding-bottom:.5rem;border-bottom:1px solid #e0e0e0}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem}.stat-card{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;padding:1.5rem;text-align:center;color:#fff;box-shadow:0 4px 6px #0000001a}.stat-value{font-size:2.5rem;font-weight:700;margin-bottom:.5rem}.stat-label{font-size:.9rem;opacity:.9;text-transform:uppercase;letter-spacing:.5px}.wins-distribution{display:flex;flex-direction:column;gap:1rem}.distribution-item{display:flex;align-items:center;gap:1rem}.distribution-label{min-width:120px;font-weight:500;color:#333}.distribution-bar-container{flex:1;height:24px;background:#f0f0f0;border-radius:12px;overflow:hidden;position:relative}.distribution-bar{height:100%;background:linear-gradient(90deg,#667eea,#764ba2);border-radius:12px;transition:width .3s ease}.distribution-value{min-width:40px;text-align:right;font-weight:600;color:#333}.history-info{display:flex;flex-direction:column;gap:.75rem}.history-item{display:flex;justify-content:space-between;padding:.75rem;background:#f8f9fa;border-radius:8px}.history-label{font-weight:500;color:#666}.history-value{font-weight:600;color:#333}.statistics-footer{margin-top:1rem;padding-top:1.5rem;border-top:2px solid #f0f0f0;display:flex;justify-content:center}.back-button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:.75rem 2rem;border-radius:50px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 6px #0000001a}.back-button:hover{transform:translateY(-2px);box-shadow:0 6px 12px #00000026}.back-button:active{transform:translateY(0)}@media(max-width:768px){.statistics-page-container{padding:1rem .5rem}.statistics-page-content{padding:1.5rem;border-radius:12px}.statistics-title{font-size:1.5rem}.close-button-top{font-size:1.3rem;width:36px;height:36px}.stats-grid{grid-template-columns:repeat(2,1fr);gap:.75rem}.stat-card{padding:1rem}.stat-value{font-size:2rem}.section-title{font-size:1.25rem}.distribution-label{min-width:100px;font-size:.9rem}.distribution-value{min-width:30px;font-size:.9rem}}@media(prefers-color-scheme:dark){.statistics-page-content{background:#1e1e1ef2;color:#fff}.statistics-title{color:#fff}.close-button-top{background:#667eea33;border-color:#667eea;color:#667eea}.close-button-top:hover{background:#667eea4d;color:#764ba2;border-color:#764ba2}.section-title{color:#fff;border-bottom-color:#ffffff1a}.distribution-label,.distribution-value{color:#fff}.distribution-bar-container{background:#ffffff1a}.history-item{background:#ffffff0d}.history-label{color:#aaa}.history-value{color:#fff}.statistics-footer{border-top-color:#ffffff1a}}.help-page-container{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem;overflow-y:auto}.help-page-content{background:#fff;border-radius:16px;max-width:700px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 10px 40px #0000004d;position:relative;padding:2rem;animation:slideIn .3s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.help-page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:1rem;border-bottom:2px solid #e0e0e0}.help-page-title{font-size:2rem;font-weight:700;color:#333;margin:0;display:flex;align-items:center;gap:.5rem}.help-icon{font-size:2rem}.help-close-button{background:none;border:none;font-size:2rem;color:#666;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s ease}.help-close-button:hover{background:#f0f0f0;color:#333;transform:scale(1.1)}.help-subtitle{font-size:1.2rem;color:#667eea;font-weight:600;text-align:center;margin:0 0 2rem}.help-sections{display:flex;flex-direction:column;gap:1.5rem}.help-section{background:#f8f9fa;border-radius:12px;padding:1.5rem;border-left:4px solid #667eea;transition:transform .2s ease,box-shadow .2s ease}.help-section:hover{transform:translate(4px);box-shadow:0 4px 12px #0000001a}.help-section-title{font-size:1.3rem;font-weight:700;color:#333;margin:0 0 .75rem;display:flex;align-items:center;gap:.5rem}.section-icon{font-size:1.5rem}.help-section-content{color:#555;line-height:1.7}.help-paragraph{margin:.5rem 0;font-size:1rem}.help-paragraph:first-child{margin-top:0}.help-paragraph:last-child{margin-bottom:0}.help-footer{text-align:center;margin:2rem 0 1.5rem;padding-top:1.5rem;border-top:2px solid #e0e0e0;font-size:1.1rem;color:#667eea;font-weight:600}.help-actions{display:flex;justify-content:center;margin-top:1.5rem}.help-back-button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:.75rem 2rem;border-radius:25px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #667eea66}.help-back-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea99}.help-back-button:active{transform:translateY(0)}@media(max-width:768px){.help-page-content{padding:1.5rem;max-height:95vh}.help-page-title,.help-icon{font-size:1.5rem}.help-subtitle{font-size:1rem}.help-section{padding:1rem}.help-section-title{font-size:1.1rem}.help-paragraph{font-size:.9rem}.help-back-button{padding:.65rem 1.5rem;font-size:.9rem}}@media(prefers-color-scheme:dark){.help-page-content{background:#1a1a1a;color:#e0e0e0}.help-page-title{color:#fff}.help-section{background:#2a2a2a;border-left-color:#667eea}.help-section-title{color:#fff}.help-section-content{color:#ccc}.help-close-button{color:#aaa}.help-close-button:hover{background:#333;color:#fff}.help-page-header{border-bottom-color:#444}.help-footer{border-top-color:#444}}.archive-page{min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);padding:2rem;display:flex;flex-direction:column}.archive-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.archive-header h1{color:#fff;font-size:2rem;margin:0;text-shadow:2px 2px 4px rgba(0,0,0,.2)}.close-button{background:#fff3;border:2px solid white;color:#fff;font-size:1.5rem;width:40px;height:40px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.close-button:hover{background:#ffffff4d;transform:scale(1.1)}.archive-content{flex:1;background:#fff;border-radius:12px;padding:2rem;box-shadow:0 4px 20px #0003;overflow-y:auto}.archive-legend{display:flex;flex-wrap:wrap;gap:1.5rem;margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:2px solid #e0e0e0}.legend-item{display:flex;align-items:center;gap:.5rem;font-size:.9rem;color:#333}.status-indicator{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem}.archive-calendars{display:flex;flex-direction:column;gap:2rem}.calendar-month{margin-bottom:2rem}.month-header{font-size:1.5rem;font-weight:600;color:#333;margin-bottom:1rem;text-align:center}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;background:#e0e0e0;border:2px solid #e0e0e0;border-radius:4px;overflow:hidden}.calendar-day-name{background:#f5f5f5;padding:.5rem;text-align:center;font-weight:600;font-size:.85rem;color:#666;border-bottom:2px solid #e0e0e0}.calendar-day{background:#fff;min-height:60px;padding:.25rem;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;position:relative;cursor:default;transition:all .15s ease}.calendar-day.empty{background:#fafafa;cursor:default}.calendar-day.clickable{cursor:pointer}.calendar-day.clickable:hover{background:#f0f0f0;z-index:1;box-shadow:0 2px 4px #0000001a}.calendar-day.status-won{background:#e8f5e9}.calendar-day.status-lost{background:#ffebee}.calendar-day.status-abandoned{background:#fff3e0}.calendar-day.status-not-played{background:#fff}.calendar-day.status-unavailable{background:#f5f5f5;opacity:.5;cursor:not-allowed}.calendar-day.status-unavailable .day-number{color:#999}.day-number{font-size:.9rem;font-weight:500;color:#333;margin-top:.25rem}.day-status-icon{font-size:.7rem;font-weight:700;margin-top:.1rem;line-height:1}.calendar-day.status-won .day-status-icon{color:#4caf50}.calendar-day.status-lost .day-status-icon{color:#f44336}.calendar-day.status-abandoned .day-status-icon{color:#ff9800}.calendar-day.status-not-played .day-status-icon{color:#bdbdbd}.status-indicator.status-won{background:#4caf50;color:#fff}.status-indicator.status-lost{background:#f44336;color:#fff}.status-indicator.status-abandoned{background:#ff9800;color:#fff}.status-indicator.status-not-played{background:#bdbdbd;color:transparent}.status-indicator.status-unavailable{background:#e0e0e0;color:transparent;opacity:.6}.error-message{color:#f44336;text-align:center;padding:2rem}@media(max-width:768px){.archive-page{padding:1rem}.archive-header h1{font-size:1.5rem}.archive-content{padding:1rem}.month-header{font-size:1.2rem}.calendar-day{min-height:50px;padding:.2rem}.day-number{font-size:.8rem}.day-status-icon{font-size:.6rem}.calendar-day-name{font-size:.75rem;padding:.4rem}.archive-legend{gap:1rem;font-size:.85rem}.legend-item{font-size:.8rem}.status-indicator{width:20px;height:20px;font-size:.8rem}}.app{width:100%;min-height:100vh}