*{box-sizing:border-box}html,body{margin:0;padding:0;width:100%;overflow-x:hidden}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#111827;color:#fff;overscroll-behavior-y:contain}@keyframes fadeInScale{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(5px)}}.App{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:20px}.content-wrapper{width:100%;display:flex;flex-direction:column;align-items:center}.app-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;padding:10px;background-color:#0000001a;border-radius:10px;gap:15px;justify-content:center;flex-grow:1;width:100%}.app-title{font-size:2.25rem;line-height:2.5rem;font-weight:700;color:#38bdf8;margin-bottom:.5rem}.app-subtitle{color:#cbd5e1;margin-top:-.5rem}.title-area{text-align:center;flex:2}.global-counter{font-size:1.1rem;color:#fffc;flex:1;text-align:left}.global-counter span{font-weight:700;color:#f1c40f;text-align:center}.user-id-display{font-size:.9rem;color:#fffc;width:100%;display:flex;flex-direction:column;align-items:center;margin-bottom:10px}.user-id-label{font-weight:700;color:#fff}.error-display{width:100%;background-color:#c0392b;color:#fff;padding:15px;border-radius:8px;margin-bottom:20px;text-align:center}.success-display{width:100%;background-color:#27ae60;color:#fff;padding:15px;border-radius:8px;margin-bottom:20px;text-align:center}.warning-display{width:100%;background:linear-gradient(135deg,#f39c12,#e67e22);color:#fff;padding:15px;border-radius:8px;margin-bottom:20px;text-align:center;font-weight:600;box-shadow:0 4px 6px #0000004d;animation:warningPulse 2s ease-in-out infinite}.warning-display p{margin:0;font-size:1.1rem}@keyframes warningPulse{0%,to{transform:scale(1);box-shadow:0 4px 6px #0000004d}50%{transform:scale(1.02);box-shadow:0 6px 12px #f39c1266}}.error-title{font-weight:600}.main-content{display:flex;flex-direction:column;align-items:center;justify-content:center;flex-grow:1;width:100%}.count-label{font-size:1.5rem;margin-bottom:10px;color:#fffc}.count-display{font-size:6rem;font-weight:700;color:#fff;margin:20px 0;min-width:100px;text-align:center;transition:transform .1s ease-in-out,color .3s ease-in-out,text-shadow .3s ease-in-out;display:inline-block;position:relative}.count-text{position:relative;z-index:1}.count-display.bounce{animation:bounce .3s ease}.count-display.jiggle{animation:jiggle .4s ease-in-out}.increment-button.tier-burst-jiggle{animation:tier-burst-jiggle .5s ease-out;position:relative}.increment-button.tier-burst-jiggle:after{content:"";position:absolute;inset:-5px;border-radius:inherit;animation:tier-burst-flash .5s ease-out}.combo-yellow{color:#f1c40f;text-shadow:0 0 10px #f1c40f}.combo-orange{color:#e67e22;text-shadow:0 0 15px #e67e22}.combo-red{color:#e74c3c;text-shadow:0 0 20px #e74c3c}.combo-purple{color:#9b59b6;text-shadow:0 0 25px #9b59b6}.combo-blue{color:#3498db;text-shadow:0 0 30px #3498db}.cps-text{display:block;font-size:2rem;font-weight:400;color:#f1c40f!important;margin-top:8px}.button-text{transition:opacity .3s ease}.button-text.text-faded{opacity:.2}.last-burst-text{font-size:.9rem;color:#f1c40f;margin-top:15px;padding-top:10px;border-top:1px solid rgba(241,196,15,.2);animation:fadeIn .5s ease;text-align:center;line-height:1.4}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.cps-white{color:#fff}.cps-yellow{color:#f1c40f;text-shadow:0 0 10px #f1c40f}.cps-orange{color:#e67e22;text-shadow:0 0 15px #e67e22}.cps-red{color:#e74c3c;text-shadow:0 0 20px #e74c3c}.combo-text{display:block;font-size:2rem;font-weight:400;color:#f1c40f;margin-bottom:4px}.fire-small:before,.fire-medium:before,.fire-large:before{content:"🔥";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(var(--fire-scale, 1));font-size:5rem;opacity:var(--fire-opacity);z-index:-1;animation:fire-background .5s ease-in-out infinite alternate}.fire-small{--fire-scale: .8}.fire-medium{--fire-scale: 1.2}.fire-large{--fire-scale: 1.6}.button-text{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.2;min-height:2.5em}.count-sep{display:none}.debounce-timer{position:absolute;top:52%;left:0;right:0;height:3px;transform:translateY(-50%) scaleX(var(--debounce-progress, 0));transform-origin:center;background:linear-gradient(90deg,transparent 0%,var(--gradient-start) 5%,var(--gradient-mid) 50%,var(--gradient-end) 95%,transparent 100%);border-radius:2px;box-shadow:0 0 10px #ffffff4d;will-change:transform;z-index:1;pointer-events:none}.cps-block{display:flex;flex-direction:column;align-items:center;opacity:1;transition:opacity .2s ease;margin-top:8px}.cps-block.cps-hidden{opacity:0;pointer-events:none}.reserve-block{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;visibility:hidden}.max-combo-text{font-size:1.8rem;font-weight:700;color:#f1c40f;display:block;text-shadow:1px 1px 3px rgba(0,0,0,.5)}.lightning-top,.lightning-bottom{position:absolute;inset:0;pointer-events:none}.lightning-top:before,.lightning-top:after,.lightning-bottom:before,.lightning-bottom:after{content:"⚡️";position:absolute;font-size:3rem;opacity:0;z-index:0}.lightning-top:before{top:-20px;left:-30px;animation:lightning-flash-1 .3s steps(2,end) infinite}.lightning-top:after{top:-20px;right:-30px;animation:lightning-flash-2 .4s steps(2,end) infinite}.lightning-bottom:before{bottom:-15px;left:20px;animation:lightning-flash-3 .5s steps(2,end) infinite}.lightning-bottom:after{bottom:-15px;right:20px;animation:lightning-flash-4 .35s steps(2,end) infinite}@keyframes bounce{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes jiggle{0%,to{transform:scale(1)}25%{transform:scale(1.05) rotate(-1deg)}75%{transform:scale(.95) rotate(1deg)}}@keyframes tier-burst-jiggle{0%,to{transform:scale(1)}30%{transform:scale(1.05)}60%{transform:scale(.95)}}@keyframes tier-burst-flash{0%{box-shadow:0 0 #ffd700b3}50%{box-shadow:0 0 30px 15px #ffd700b3}to{box-shadow:0 0 #ffd700b3}}@keyframes fire-background{0%{opacity:.5}to{opacity:.9}}@keyframes lightning-flash-1{0%{opacity:0;transform:translate(-20px) rotate(-15deg)}50%{opacity:1;transform:translate(10px) rotate(5deg)}to{opacity:0;transform:translate(0) rotate(0)}}@keyframes lightning-flash-2{0%{opacity:0;transform:translate(20px) rotate(15deg)}50%{opacity:1;transform:translate(-10px) rotate(-5deg)}to{opacity:0;transform:translate(0) rotate(0)}}@keyframes lightning-flash-3{0%{opacity:0;transform:translate(-15px) rotate(15deg) scaleY(-1)}50%{opacity:1;transform:translate(10px) rotate(-5deg) scaleY(-1)}to{opacity:0;transform:translate(0) rotate(0) scaleY(-1)}}@keyframes lightning-flash-4{0%,to{opacity:0;transform:translateY(0)}50%{opacity:1;transform:translateY(5px)}}.max-combo-flash{position:fixed;inset:0;background:radial-gradient(circle at 50% 45%,gold,transparent 70%);pointer-events:none;z-index:9999;animation:max-combo-flash-animation .8s ease-out}@keyframes max-combo-flash-animation{0%{opacity:0;transform:scale(.3)}50%{opacity:.6}to{opacity:0;transform:scale(2)}}.increment-button{background:linear-gradient(145deg,#28b485,#56ab2f);color:#fff;border:none;border-radius:15px;padding:20px 40px;font-size:2.5rem;font-weight:700;cursor:pointer;transition:all .2s ease-in-out;box-shadow:0 4px 15px #0003;width:95%;height:var(--increment-button-height, auto);max-width:900px;display:flex;align-items:center;justify-content:center;touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;min-width:56px;min-height:56px}.increment-button:focus{outline:3px solid #f1c40f;outline-offset:3px}.increment-button:focus:not(:focus-visible){outline:none}.increment-button{transition:transform .15s cubic-bezier(.2,1.2,.2,1)}.increment-button.button-pressed{transform:scale(.97);transition:transform 90ms cubic-bezier(.2,.9,.2,1)}.floating-number{position:absolute;transform:translate(-50%,-50%);font-size:1.5rem;font-weight:700;color:var(--combo-color, #ffffff);pointer-events:none;animation:floatUp 1s ease-out forwards;text-shadow:0 2px 4px rgba(0,0,0,.5),0 0 10px currentColor;z-index:100}@keyframes floatUp{0%{transform:translate(-50%,-50%) scale(1.2);opacity:1}to{transform:translate(-50%,-150px) scale(.8);opacity:0}}.increment-button.measure{position:absolute;opacity:0;pointer-events:none;top:0;left:0;width:100%}.increment-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 15px 25px #0000004d,inset 0 -5px 10px #0000004d}.increment-button:active:not(:disabled){transform:translateY(2px);box-shadow:0 5px 10px #0003,inset 0 -3px 8px #0000004d}.increment-button:disabled{background:#555;border-color:#444;cursor:not-allowed;opacity:.6}.app-footer{margin-top:2rem;font-size:.75rem;color:#94a3b8}.footer-text span{font-family:monospace}.network-status{font-weight:700}.network-status.online{color:#2ecc71}.network-status.offline{color:#e74c3c}.back-button{padding:6px 12px;font-size:.8rem;font-weight:700;border:1px solid #cbd5e1;border-radius:8px;cursor:pointer;transition:background-color .3s ease,color .3s ease;background-color:transparent;color:#cbd5e1;white-space:normal;max-width:90px;text-align:center;display:inline-flex;align-items:center;justify-content:center;line-height:1.1}.back-button:hover{background-color:#cbd5e1;color:#1e293b}@media (max-width: 640px){.back-button{padding:2px 10px;font-size:.68rem;border-radius:6px;max-width:72px;box-sizing:border-box}}.hot-flame-text{color:transparent;background:linear-gradient(90deg,#e74c3c,#9b59b6,#3498db,#9b59b6,#e74c3c);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;animation:flame-gradient-animation 4s linear infinite;text-shadow:none}@keyframes flame-gradient-animation{0%{background-position:100% 50%}to{background-position:0% 50%}}.header-buttons{display:flex;flex-direction:column;align-items:flex-end;gap:5px;flex:1}.sound-toggle{background:none;border:none;font-size:1.5rem;cursor:pointer;padding:5px;border-radius:50%;transition:all .3s ease;display:flex;align-items:center;justify-content:center;width:40px;height:40px}.sound-toggle:hover{background-color:#ffffff1a}.sound-toggle.sound-on{color:#38bdf8}.sound-toggle.sound-off{color:#94a3b8}.button-container{width:100%;display:flex;flex-direction:column;align-items:center;margin-top:20px;position:relative}.progress-bar-wrapper{display:flex;flex-direction:column;align-items:center;margin-bottom:2px}.progress-bar-placeholder{height:30px;width:300px}.accumulated-fires{display:flex;flex-direction:column;gap:4px;align-items:center;justify-content:flex-end;width:100%}.fire-row{display:flex;gap:3px;justify-content:center;align-items:center;height:30px}.accumulated-fire{font-size:24px;animation:fire-bounce .5s ease-out;width:28px;text-align:center}@keyframes fire-bounce{0%{transform:scale(0) rotate(0)}50%{transform:scale(1.2) rotate(180deg)}to{transform:scale(1) rotate(360deg)}}.progress-bar-container{width:300px;position:relative;animation:fadeIn .3s ease-out}.progress-bar-outline{width:100%;height:30px;background:#ffffff1a;border:2px solid rgba(255,255,255,.3);border-radius:15px;overflow:hidden;position:relative}.progress-bar-fill{height:100%;background:linear-gradient(90deg,#f59e0b,#ef4444,#f59e0b);background-size:200% 100%;animation:shimmer 2s linear infinite;transition:width .2s ease-out;display:flex;align-items:center;position:relative}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.progress-bar-icons{display:flex;align-items:center;padding:0 5px;position:absolute;right:0;height:100%}.progress-icon{font-size:18px;margin:0 1px;animation:flicker .5s ease-in-out infinite alternate}@keyframes flicker{0%{transform:scale(1);filter:brightness(1)}to{transform:scale(1.1);filter:brightness(1.3)}}.progress-bar-label{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-weight:700;font-size:14px;color:#fff;text-shadow:1px 1px 2px rgba(0,0,0,.5);pointer-events:none}.keep-going-text{font-size:16px;font-weight:700;color:#fbbf24;text-shadow:0 0 10px rgba(251,191,36,.8);animation:pulse-glow .3s ease-out}@keyframes pulse-glow{0%{transform:scale(.8);opacity:0}50%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}.two-hand-warning{position:absolute;top:-60px;left:50%;transform:translate(-50%);background:linear-gradient(135deg,#ff6b6b,#ff4757);color:#fff;padding:12px 24px;border-radius:25px;font-weight:700;font-size:1.1rem;box-shadow:0 4px 15px #ff475766;animation:warningPulse .3s ease-out,warningShake .5s ease-out;z-index:1000;white-space:nowrap;pointer-events:none}@media (max-width: 640px){.two-hand-warning{font-size:.95rem;padding:10px 18px;top:-50px}}@keyframes warningPulse{0%{transform:translate(-50%) scale(.8);opacity:0}50%{transform:translate(-50%) scale(1.05)}to{transform:translate(-50%) scale(1);opacity:1}}@keyframes warningShake{0%,to{transform:translate(-50%) rotate(0)}25%{transform:translate(-50%) rotate(-2deg)}75%{transform:translate(-50%) rotate(2deg)}}.modal-overlay{position:fixed;inset:0;background-color:#000c;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background-color:#1e293b;padding:2rem;border-radius:10px;max-width:400px;width:90%;box-shadow:0 20px 25px -5px #00000080}.modal-content h2{color:#38bdf8;margin-bottom:1rem;text-align:center}.modal-content p{color:#94a3b8;margin-bottom:1.5rem;text-align:center}.save-stats-title{color:#38bdf8;font-weight:700;margin-bottom:1rem}.modal-stats{background:#0000004d;border-radius:8px;padding:1rem;margin-bottom:1.5rem;display:flex;justify-content:space-evenly;align-items:stretch;gap:.5rem;min-height:60px}.stat-item{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;padding:.5rem 0}.stat-label{color:#94a3b8;font-size:.875rem;margin-bottom:.25rem}.stat-value{color:#fbbf24;font-size:1.25rem;font-weight:700}.modal-content input{width:100%;padding:.75rem;background-color:#0f172a;border:2px solid #334155;border-radius:5px;color:#fff;font-size:1rem;margin-bottom:1rem}.modal-content input:focus{outline:none;border-color:#38bdf8}.error-message{color:#ef4444;font-size:.875rem;margin-top:-.5rem;margin-bottom:1rem}.modal-buttons{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.modal-buttons button{padding:.75rem 1.5rem;border-radius:5px;font-size:1rem;font-weight:600;cursor:pointer;border:none}.modal-buttons button[type=submit]{background-color:#38bdf8;color:#fff}.modal-buttons button[type=submit]:hover:not(:disabled){background-color:#0284c7}.modal-buttons button[type=submit]:disabled{opacity:.5;cursor:not-allowed}.modal-buttons button[type=button]{background-color:#475569;color:#fff}.modal-buttons button[type=button]:hover{background-color:#64748b}.modal-buttons button.exit-button{background-color:#dc2626;color:#fff;width:100%;margin-top:.5rem}.modal-buttons button.exit-button:hover{background-color:#991b1b}.guest-info{display:flex;flex-direction:column;align-items:center;margin-top:.5rem;margin-bottom:1rem}.create-username-button{padding:.5rem 1rem;background-color:#38bdf8;color:#fff;border:none;border-radius:5px;font-size:.875rem;font-weight:600;cursor:pointer;transition:background-color .2s;margin-bottom:.5rem}.create-username-button:hover{background-color:#0284c7}.guest-note{color:#94a3b8;font-size:.875rem;margin:0;text-align:center}.control-buttons{display:flex;align-items:center;justify-content:center;gap:2px}@media (max-width: 640px){.control-buttons{gap:0px;transform:translate(20px)}.back-button{transform:translate(15px)}}.sound-settings{display:flex;flex-direction:column;gap:15px}.sound-setting-row{display:flex;justify-content:space-between;align-items:center;padding:10px;background:#ffffff0d;border-radius:8px}.sound-setting-row label{color:#ffffffe6;font-size:1rem}.settings-toggle{padding:6px 16px;border:none;border-radius:20px;font-weight:600;cursor:pointer;transition:all .3s ease;min-width:60px}.settings-toggle.toggle-on{background:#38bdf8;color:#fff}.settings-toggle.toggle-off{background:#fff3;color:#fff9}.volume-setting{display:flex;align-items:center;gap:15px;flex:1;max-width:200px}.settings-volume-slider{flex:1;height:4px;-webkit-appearance:none;appearance:none;background:#ffffff4d;border-radius:2px;outline:none}.settings-volume-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;background:#38bdf8;border-radius:50%;cursor:pointer}.settings-volume-slider::-moz-range-thumb{width:16px;height:16px;background:#38bdf8;border-radius:50%;cursor:pointer}.volume-percentage{color:#38bdf8;font-weight:600;min-width:40px;text-align:right}.settings-button{background:none;border:none;color:#fff;cursor:pointer;padding:8px;border-radius:8px;transition:all .3s ease;font-size:1.2rem;display:flex;align-items:center;justify-content:center}.settings-button:hover{background-color:#ffffff1a;transform:rotate(45deg)}.settings-button:active{transform:scale(.95) rotate(45deg)}.modal-overlay{position:fixed;inset:0;background-color:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:linear-gradient(135deg,#2c2c54,#40407a);padding:30px;border-radius:15px;box-shadow:0 10px 25px #00000080;max-width:400px;width:90%;text-align:center}.modal-content h2{color:#ff6b6b;margin-bottom:20px}.modal-content h3{color:#fff;margin-bottom:10px;font-size:1.2rem}.modal-content input{width:100%;padding:10px;margin:10px 0;border:1px solid #555;border-radius:8px;background-color:#333;color:#fff;font-size:1rem;box-sizing:border-box}.settings-section{margin:20px 0}.settings-description{color:#fffc;font-size:.9rem;margin-bottom:15px}.settings-buttons{display:flex;gap:10px;justify-content:center;margin-top:20px}.save-button{background-color:#4caf50;color:#fff;padding:10px 20px;border:none;border-radius:8px;cursor:pointer;font-size:1rem;transition:all .3s ease}.save-button:hover{background-color:#45a049}.cancel-button{background-color:#666;color:#fff;padding:10px 20px;border:none;border-radius:8px;cursor:pointer;font-size:1rem;transition:all .3s ease}.cancel-button:hover{background-color:#777}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:20px 0}.stat-item{background:#ffffff1a;padding:20px;border-radius:10px;text-align:center;border:2px solid rgba(255,255,255,.2)}.weekly-top10-split{display:flex;align-items:center;justify-content:center;gap:8px}.weekly-category-btn{background:none;border:none;color:#4fc3f7;font-size:1em;font-weight:700;cursor:pointer;padding:0 4px;transition:all .2s ease;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:4px}.weekly-category-btn:hover{color:#81d4fa;transform:scale(1.1)}.weekly-top10-split .divider{color:#ffffff4d;font-size:1em;-webkit-user-select:none;user-select:none}.stat-value{font-size:1.8rem;font-weight:700;color:#ff6b6b;margin-bottom:5px}.stat-label{font-size:.9rem;color:#fffc;text-transform:uppercase;letter-spacing:1px}.app-title{font-weight:800;letter-spacing:.5px;color:transparent;background:linear-gradient(90deg,#ff6b6b,#f59e0b,#34d399,#38bdf8,#a78bfa,#ff6b6b);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;animation:titleGradient 8s linear infinite;font-size:2rem;line-height:1.15}@media (min-width: 640px){.app-title{font-size:2.5rem}}@media (min-width: 1024px){.app-title{font-size:3rem}}@keyframes titleGradient{0%{background-position:0% 50%}to{background-position:100% 50%}}@keyframes titleGradientLoop{0%{background-position:0% 50%}to{background-position:200% 50%}}.click-mania-title{font-size:4.5rem;font-weight:800;letter-spacing:.5px;color:transparent;background:linear-gradient(90deg,#ff8c00,#ff4500,gold,#ff6b6b,#f59e0b,gold,#ff4500,#ff8c00,#ff4500,gold,#ff6b6b,#f59e0b,gold,#ff4500,#ff8c00);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;animation:titleGradientLoop 6s linear infinite,titleBreathe 3.5s ease-in-out infinite;text-shadow:0 0 10px rgba(255,140,0,.2),0 0 20px rgba(255,69,0,.1);line-height:1;text-transform:uppercase;display:inline-block;margin:0;margin-bottom:.25rem}@media (max-width: 640px){.click-mania-title{font-size:2.5rem;text-shadow:0 0 8px rgba(255,140,0,.15),0 0 15px rgba(255,69,0,.08)}}@media (min-width: 640px) and (max-width: 1024px){.click-mania-title{font-size:3.5rem}}.title-breathe{animation:titleBreathe 3.5s ease-in-out infinite;text-shadow:0 0 10px rgba(56,189,248,.35),0 0 22px rgba(245,158,11,.25)}@keyframes titleBreathe{0%,to{transform:scale(1);filter:brightness(1)}50%{transform:scale(1.03);filter:brightness(1.08)}}.title-underline{position:relative;display:inline-block}@keyframes screen-shake{0%,to{transform:translateZ(0)}25%{transform:translate3d(2px,-2px,0)}50%{transform:translate3d(-2px,1px,0)}75%{transform:translate3d(1px,1px,0)}}.shake{animation:screen-shake .15s ease-in-out}@keyframes pulse{0%{box-shadow:0 4px 6px #8b5cf64d}50%{box-shadow:0 4px 12px #8b5cf699}to{box-shadow:0 4px 6px #8b5cf64d}}.create-user-settings-btn{background:linear-gradient(135deg,#ff6b35,#ff8555);color:#fff;border:none;border-radius:8px;padding:12px 20px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #ff6b354d;width:100%;display:flex;align-items:center;justify-content:center;gap:8px}.create-user-settings-btn:hover{background:linear-gradient(135deg,#ff8555,#ffa375);transform:translateY(-2px);box-shadow:0 4px 12px #ff6b3566}.create-user-settings-btn:active{transform:translateY(0);box-shadow:0 2px 4px #ff6b354d}@media (prefers-reduced-motion: reduce){.app-title,.click-mania-title,.title-breathe{animation:none}.title-underline:after{animation:none}.shake{animation:none}.create-user-settings-btn{transition:none}}.start-screen-container{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px}.start-screen{max-width:400px;width:100%;padding:30px;background-color:#0003;border-radius:15px;text-align:center;box-shadow:0 10px 25px #0000004d}.start-title{font-size:2rem;margin-bottom:10px}.start-subtitle{font-size:1rem;color:#fffc;margin-bottom:30px}.start-form{display:flex;flex-direction:column;gap:15px}.username-input{padding:12px;font-size:1rem;border:1px solid #555;border-radius:8px;background-color:#333;color:#fff;text-align:center}.username-input::placeholder{color:#888}.start-button{padding:12px 20px;font-size:1rem;font-weight:700;border:none;border-radius:8px;cursor:pointer;transition:background-color .3s ease,transform .2s ease;background-color:#3498db;color:#fff}.start-button:disabled{background-color:#555;cursor:not-allowed}.start-button:not(:disabled):hover{background-color:#2980b9;transform:translateY(-2px)}.start-screen h1.start-title{font-size:2rem;font-weight:700;color:#fff;margin-bottom:20px;line-height:1.2;text-align:center}.fire-gradient{font-size:4.5rem;font-weight:700;background:linear-gradient(90deg,#ff8c00,#ff4500,gold,#ff4500,#ff8c00);background-size:200% 200%;color:transparent;-webkit-background-clip:text;background-clip:text;animation:fire-flow 4s linear infinite}@keyframes fire-flow{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.start-screen p.start-subtitle{font-size:1.2rem;color:#a0aec0}.username-display{font-size:1.1rem;color:#94a3b8;margin-bottom:10px}.username-display strong{color:#38bdf8}.password-input,.email-input{padding:12px;font-size:1rem;border:1px solid #555;border-radius:8px;background-color:#333;color:#fff;text-align:center}.password-input::placeholder,.email-input::placeholder{color:#888}.remember-device{display:flex;align-items:center;justify-content:center;gap:8px;color:#94a3b8;font-size:.9rem;cursor:pointer}.remember-device input[type=checkbox]{cursor:pointer}.guest-stats-box{background:linear-gradient(135deg,#1e293b,#334155);border:2px solid #38bdf8;border-radius:12px;padding:1rem;margin-bottom:1.5rem;animation:pulse-glow 2s ease-in-out infinite}@keyframes pulse-glow{0%,to{box-shadow:0 0 10px #38bdf84d}50%{box-shadow:0 0 20px #38bdf880}}.guest-stats-title{margin:0 0 .75rem;color:#38bdf8;font-weight:700;text-align:center;font-size:1.1rem}.guest-stats{display:flex;justify-content:space-around;gap:1rem;flex-wrap:wrap}.guest-stats span{color:#cbd5e1;font-size:.95rem}.guest-stats strong{color:#fbbf24;font-size:1.1rem;margin-left:.25rem}.error-message{color:#ef4444;font-size:.9rem;margin:0}.button-group{display:flex;gap:10px;margin-top:10px;justify-content:center}.back-button{padding:12px 20px;font-size:1rem;border:none;border-radius:8px;cursor:pointer;background-color:#475569;color:#fff;transition:background-color .3s ease}.back-button:hover:not(:disabled){background-color:#64748b}.back-button.full-width{width:100%}.number-options{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:300px;margin:20px auto}.number-option{padding:15px;font-size:1.3rem;font-weight:700;border:2px solid #334155;border-radius:10px;background-color:#1e293b;color:#38bdf8;cursor:pointer;transition:all .3s ease;aspect-ratio:1;display:flex;align-items:center;justify-content:center}.number-option:hover:not(:disabled){background-color:#334155;border-color:#38bdf8;transform:scale(1.05)}.number-option:disabled{opacity:.5;cursor:not-allowed}.lock-message{padding:20px;background-color:#7f1d1d;border-radius:8px;color:#fca5a5;margin:20px 0;font-weight:600}.play-as-label{font-size:1.2rem;color:#94a3b8;margin-bottom:10px;font-weight:500}.remember-explanation{color:#94a3b8;font-size:.9rem;margin:20px 0;line-height:1.5;text-align:center}.fire-placeholder{display:flex;justify-content:center;align-items:center;gap:5px;height:48px;background-color:#333;border:1px solid #555;border-radius:8px;overflow:hidden}.fire-emoji{font-size:1.5rem;animation:fire-dance .8s ease-in-out infinite}.fire-emoji:nth-child(1){animation-delay:0s}.fire-emoji:nth-child(2){animation-delay:.2s}.fire-emoji:nth-child(3){animation-delay:.4s}@keyframes fire-dance{0%,to{transform:translateY(0) scale(1);filter:brightness(1)}25%{transform:translateY(-5px) scale(1.1);filter:brightness(1.2)}50%{transform:translateY(-8px) scale(1.15);filter:brightness(1.4)}75%{transform:translateY(-5px) scale(1.1);filter:brightness(1.2)}}.link-button{background:none;border:none;color:#f99;text-decoration:underline;cursor:pointer;padding:8px;font-size:.9rem;transition:color .2s}.link-button:hover:not(:disabled){color:#fcc}.link-button:disabled{color:#666;cursor:not-allowed}.recovery-info{font-size:.9rem;color:#ffffffb3;margin:10px 0}.success-message{color:#4caf50;font-size:.9rem;margin:10px 0;padding:10px;background-color:#4caf501a;border-radius:5px}.leaderboard{margin-top:20px;padding:20px;background-color:#0003;border-radius:15px;width:100%;max-width:400px;box-shadow:0 10px 25px #0000004d}@keyframes sparkleGradient{0%{background-position:0% 50%;filter:brightness(1.2)}25%{filter:brightness(1.5)}50%{background-position:100% 50%;filter:brightness(1.8)}75%{filter:brightness(1.5)}to{background-position:0% 50%;filter:brightness(1.2)}}.save-score-sparkle{background:linear-gradient(90deg,red,#ff4500,#ff8c00,orange,#ff0,orange,#ff4500 90%,red);background-size:200% 100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:sparkleGradient 3s ease-in-out infinite;font-weight:700;text-decoration:underline;text-decoration-color:#ffa50066;text-underline-offset:2px;display:inline-block;position:relative}.save-score-sparkle:before{content:"🔥";position:absolute;left:-25px;animation:floatSparkle 2s ease-in-out infinite;font-size:.8em}.save-score-sparkle:after{content:"🔥";position:absolute;right:-25px;animation:floatSparkle 2s ease-in-out infinite .5s;font-size:.8em}@keyframes floatSparkle{0%,to{transform:translateY(0) scale(1);opacity:.8}50%{transform:translateY(-3px) scale(1.1);opacity:1}}.leaderboard h2{text-align:center;margin-top:0;margin-bottom:20px;color:#f1c40f}.leaderboard ol{list-style:none;padding:0;margin:0;transition:min-height .2s ease;position:relative}.leaderboard li{display:flex;align-items:center;padding:10px;border-bottom:1px solid rgba(255,255,255,.1);font-size:1.1rem;position:relative;transition:transform .5s cubic-bezier(.4,0,.2,1),opacity .3s ease;will-change:transform}@keyframes slideDown{0%{transform:translateY(-100%);opacity:.7}to{transform:translateY(0);opacity:1}}@keyframes slideUp{0%{transform:translateY(100%);opacity:.7}to{transform:translateY(0);opacity:1}}@keyframes slideIn{0%{transform:translate(-30px);opacity:0}to{transform:translate(0);opacity:1}}.leaderboard li.sliding-down{animation:slideDown .5s cubic-bezier(.4,0,.2,1)}.leaderboard li.sliding-up{animation:slideUp .5s cubic-bezier(.4,0,.2,1)}.leaderboard li.sliding-in{animation:slideIn .5s cubic-bezier(.4,0,.2,1)}.leaderboard li.rank-changed{animation:rankChangePulse .6s ease-out}@keyframes rankChangePulse{0%{background-color:#ffd70000}30%{background-color:#ffd7004d;transform:scale(1.02)}to{background-color:#ffd70000;transform:scale(1)}}.leaderboard li:last-child{border-bottom:none}.leaderboard-list li:last-child{border-bottom:1px solid rgba(255,255,255,.1)}.leaderboard li.placeholder{visibility:hidden}.placeholder-peek{visibility:hidden;min-height:41px}.skeleton-row{display:flex;align-items:center;padding:10px;margin-bottom:8px;border-radius:8px;animation:skeleton-pulse 1.5s ease-in-out infinite}.skeleton-rank{width:24px;height:14px;background:linear-gradient(90deg,#ffffff1a 25%,#fff3,#ffffff1a 75%);background-size:200% 100%;animation:skeleton-shimmer 1.5s infinite;border-radius:4px;margin-right:12px}.skeleton-username{flex:1;height:14px;background:linear-gradient(90deg,#ffffff1a 25%,#fff3,#ffffff1a 75%);background-size:200% 100%;animation:skeleton-shimmer 1.5s infinite;border-radius:4px;margin-right:12px;max-width:120px}.skeleton-score{width:70px;height:14px;background:linear-gradient(90deg,#ffffff1a 25%,#fff3,#ffffff1a 75%);background-size:200% 100%;animation:skeleton-shimmer 1.5s infinite;border-radius:4px}@keyframes skeleton-pulse{0%,to{opacity:.6}50%{opacity:.8}}@keyframes skeleton-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.leaderboard-list{transition:opacity .15s ease-out}.leaderboard-list.switching{opacity:.4}.leaderboard li:not(.placeholder)+li.placeholder{border-bottom:none}.leaderboard .rank{width:30px;font-weight:700;color:#f1c40f}.leaderboard .username-container{flex-grow:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.leaderboard .username-text{font-weight:700;display:inline-block;padding:2px 4px;margin:-2px -4px;border-radius:4px}.leaderboard .score{font-family:Courier New,Courier,monospace;font-weight:700;color:#2ecc71}.leaderboard p{text-align:center;color:#ffffffb3}.leaderboard-tabs{display:flex;gap:10px;margin-bottom:20px;justify-content:center}.tab-button{flex:1;padding:10px 20px;background-color:#ffffff1a;border:none;border-radius:8px;color:#fff9;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.34,1.56,.64,1);transform:scale(1)}.tab-button:hover{background-color:#fff3;color:#fffc;transform:scale(1.05)}.tab-button:active{transform:scale(.95);transition:transform .1s ease}.tab-button.active{background-color:#38bdf8;color:#fff;box-shadow:0 6px 20px #38bdf866;transform:scale(1.02)}.tab-button.active:hover{background-color:#0284c7;transform:scale(1.07)}.leaderboard .error-display,.leaderboard ol,.leaderboard p{will-change:contents}.leaderboard li{transition:all .3s ease;position:relative}@keyframes rowPulse{0%{background-color:#fff0;transform:scale(1)}50%{background-color:#38bdf833;transform:scale(1.02)}to{background-color:#fff0;transform:scale(1)}}.pulse-animation{animation:rowPulse .6s ease-out}@keyframes slideIn{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.leaderboard li.new-entry{animation:slideIn .3s ease-out}.leaderboard ol{position:relative}.pulse-animation .score{animation:scoreGlow .6s ease-out}@keyframes scoreGlow{0%,to{text-shadow:none}50%{text-shadow:0 0 15px rgba(46,204,113,.8)}}.leaderboard ol{transition:opacity .2s ease}@keyframes fadeSlideIn{0%{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.tab-transitioning{animation:fadeSlideIn .25s cubic-bezier(.34,1.56,.64,1)}.tab-transitioning li{animation:fadeSlideIn .3s cubic-bezier(.34,1.56,.64,1) both}.tab-transitioning li:nth-child(1){animation-delay:.02s}.tab-transitioning li:nth-child(2){animation-delay:.04s}.tab-transitioning li:nth-child(3){animation-delay:.06s}.tab-transitioning li:nth-child(4){animation-delay:.08s}.tab-transitioning li:nth-child(5){animation-delay:.1s}.tab-transitioning li:nth-child(6){animation-delay:.12s}.tab-transitioning li:nth-child(7){animation-delay:.14s}.tab-transitioning li:nth-child(8){animation-delay:.16s}.tab-transitioning li:nth-child(9){animation-delay:.18s}.tab-transitioning li:nth-child(10){animation-delay:.2s}.leaderboard li.selected-row{background-color:#ffffff08;transform:translate(2px)}.leaderboard li.selected-row .username-text{color:#38bdf8;text-decoration:underline;cursor:pointer}.leaderboard li:not(.selected-row) .username-text:hover{text-decoration:underline;color:#38bdf8;cursor:pointer;background-color:#38bdf81a}.leaderboard li:not(.placeholder):hover{background-color:#ffffff08;transform:translate(2px)}.leaderboard li.current-user{background:linear-gradient(90deg,#38bdf814,#38bdf81f,#38bdf814);border-left:3px solid rgba(56,189,248,.5);padding-left:7px;position:relative}.leaderboard li.current-user:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(56,189,248,.05),transparent);pointer-events:none}.leaderboard li.current-user .username-text{color:#fffffff2;font-weight:700}.leaderboard li.current-user.selected-row .username-text{color:#38bdf8;text-decoration:underline}.time-toggle{display:flex;background:#0000004d;border-radius:12px;padding:4px;margin-bottom:15px;box-shadow:inset 0 2px 4px #0000004d;border:1px solid rgba(255,255,255,.05)}.seg-btn{flex:1;padding:8px 16px;background:transparent;color:#ffffff80;border:none;border-radius:8px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.seg-btn:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent,rgba(255,255,255,.05));opacity:0;transition:opacity .3s ease}.seg-btn:hover:not(.active){color:#fffc}.seg-btn:hover:not(.active):before{opacity:1}.seg-btn.active{background:linear-gradient(135deg,#38bdf8,#0ea5e9);color:#fff;box-shadow:0 2px 8px #38bdf866;transform:scale(1.02)}.seg-btn.active:hover{background:linear-gradient(135deg,#0ea5e9,#0284c7);box-shadow:0 4px 12px #38bdf880}.weekly-countdown{text-align:center;font-size:.85rem;color:#f59e0b;margin-top:-8px;margin-bottom:15px;font-weight:500;letter-spacing:.5px;text-transform:uppercase;opacity:.9;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.9}50%{opacity:1}}.weekly-top10-link{background:none;border:none;color:#0ea5e9;cursor:pointer;text-decoration:underline;font-size:inherit;padding:0;transition:color .2s ease}.weekly-top10-link:hover{color:#38bdf8}@media (max-width: 480px){.time-toggle{margin-bottom:12px}.seg-btn{padding:6px 12px;font-size:.9rem}.weekly-countdown{font-size:.8rem;margin-bottom:12px}}.user-position-section{margin-top:0;animation:fadeIn .3s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.position-separator{display:flex;align-items:center;justify-content:center;padding:10px;border-bottom:1px solid rgba(255,255,255,.1);font-size:1.1rem;min-height:44px}.position-separator.no-border{border-bottom:none}.separator-dots{color:#ffffff4d;font-size:1.2rem;letter-spacing:8px;display:inline-block;animation:pulse 2s ease-in-out infinite}.user-position-list{list-style:none;padding:0;margin:0}.user-position-list li{display:flex;align-items:center;padding:10px;border-bottom:1px solid rgba(255,255,255,.1);font-size:1.1rem;transition:all .3s ease}.user-position-list li:last-child{border-bottom:none}.user-position-list .peek-row{opacity:.8;background:#ffffff05}.user-position-list .peek-row .rank,.user-position-list .peek-row .username-text,.user-position-list .peek-row .score{opacity:.8}.user-position-list .peek-row:hover,.user-position-list .peek-row.selected-row{background-color:#ffffff08;transform:translate(2px)}.user-position-list .peek-row.selected-row .username-text,.user-position-list .peek-row .username-text:hover{color:#38bdf8;text-decoration:underline;cursor:pointer;background-color:#38bdf81a}.user-position-list .current-user{background:linear-gradient(90deg,#38bdf814,#38bdf81f,#38bdf814);border-left:3px solid rgba(56,189,248,.5);padding-left:7px;position:relative}.user-position-list .current-user:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(56,189,248,.05),transparent);pointer-events:none}.user-position-list .current-user .username-text{color:#fffffff2;font-weight:700}.user-position-list .rank{width:30px;font-weight:700;color:#f1c40f}.user-position-list .username-container{flex-grow:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-position-list .username-text{font-weight:700;display:inline-block;padding:2px 4px;margin:-2px -4px;border-radius:4px}.user-position-list .score{font-family:Courier New,Courier,monospace;font-weight:700;color:#2ecc71}@media (prefers-reduced-motion: reduce){.leaderboard li,.pulse-animation,.tab-transitioning,.weekly-countdown,.user-position-section{animation:none!important;transition:none!important}.seg-btn{transition:color .2s ease!important}}.modal-overlay{position:fixed;inset:0;background-color:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s ease-out}.modal-content{background:linear-gradient(135deg,#1e3c72,#2a5298);border-radius:15px;padding:30px;max-width:500px;width:90%;max-height:70vh;overflow-y:auto;position:relative;box-shadow:0 20px 60px #00000080;animation:slideIn .3s ease-out}@keyframes slideIn{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-close{position:absolute;top:15px;right:15px;background:none;border:none;color:#fffc;font-size:2rem;cursor:pointer;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s ease}.modal-close:hover{background-color:#ffffff1a;color:#fff;transform:scale(1.1)}.modal-content h2{margin:0 0 20px;color:#f1c40f;text-align:center;font-size:1.5rem}.weekly-achievements{list-style:none;padding:0;margin:0}.weekly-achievements li{display:flex;align-items:center;justify-content:space-between;padding:12px;margin-bottom:10px;background-color:#ffffff1a;border-radius:8px;transition:all .2s ease}.weekly-achievements li:hover{background-color:#ffffff26;transform:translate(5px)}.weekly-achievements .position{font-weight:700;color:#f1c40f;font-size:1.2rem;min-width:40px}.weekly-achievements .week-dates{flex:1;text-align:center;color:#ffffffe6}.weekly-achievements .category{color:#2ecc71;font-weight:600;text-align:right;min-width:100px}.no-achievements{text-align:center;color:#ffffffb3;padding:20px;font-style:italic}@media (max-width: 480px){.modal-content{padding:20px;width:95%;max-height:80vh}.modal-content h2{font-size:1.25rem}.weekly-achievements li{flex-direction:column;align-items:flex-start;gap:8px}.weekly-achievements .week-dates,.weekly-achievements .category{text-align:left}}@media (prefers-reduced-motion: reduce){.modal-overlay,.modal-content{animation:none}.weekly-achievements li:hover{transform:none}}.recovery-container{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px;background:linear-gradient(135deg,#1a1a2e,#16213e)}.recovery-box{max-width:400px;width:100%;padding:30px;background-color:#0003;border-radius:15px;text-align:center;box-shadow:0 10px 25px #0000004d}.recovery-box h1{font-size:2rem;margin-bottom:10px;color:#ff6b6b}.subtitle{font-size:1rem;color:#fffc;margin-bottom:30px}.recovery-form{display:flex;flex-direction:column;gap:20px}.password-input{padding:12px;font-size:1rem;border:1px solid #555;border-radius:8px;background-color:#333;color:#fff;text-align:center}.button-group{display:flex;gap:10px;justify-content:center}.back-button,.submit-button{padding:12px 24px;font-size:1rem;border:none;border-radius:8px;cursor:pointer;transition:all .3s ease}.back-button{background-color:#555;color:#fff}.back-button:hover:not(:disabled){background-color:#666}.submit-button{background-color:#ff6b6b;color:#fff}.submit-button:hover:not(:disabled){background-color:#ff5252;transform:translateY(-2px)}.submit-button:disabled,.back-button:disabled{opacity:.5;cursor:not-allowed}.error-message{color:#f44;font-size:.9rem;margin:10px 0;padding:10px;background-color:#ff44441a;border-radius:5px}.success-text{color:#4caf50;font-size:1.1rem;margin:20px 0}.error-state{display:flex;flex-direction:column;gap:20px;align-items:center}.info-text{color:#94a3b8;font-size:.95rem;margin:10px 0;line-height:1.5}.loading-state{padding:40px 20px;color:#94a3b8;font-size:1rem;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%{opacity:.6}50%{opacity:1}to{opacity:.6}}.floating-achievement{position:absolute;left:50%;top:50%;pointer-events:none;z-index:1000;font-weight:700;text-shadow:2px 2px 4px rgba(0,0,0,.3);animation:expandFromCenter 1.5s ease-out forwards;transform-origin:center;text-align:center;transform:translate(-50%,-50%)}.combo-text{color:gold;font-size:28px;margin-bottom:4px;font-weight:700}.cps-text{color:#4caf50;font-size:28px;font-weight:700}@keyframes expandFromCenter{0%{transform:translate(-50%,-50%) scale(.8);opacity:0}15%{transform:translate(-50%,-50%) scale(1.4);opacity:1}50%{transform:translate(-50%,-50%) scale(1.6);opacity:1}85%{transform:translate(-50%,-50%) scale(1.8);opacity:.5}to{transform:translate(-50%,-50%) scale(2);opacity:0}}@media (prefers-reduced-motion: reduce){.floating-achievement{animation:fadeOut 1s ease-out forwards}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}}.dev-ad-banner{width:100%;max-width:728px;margin:16px auto 0;padding:0;box-sizing:border-box}.dev-ad-inner{border:2px dashed rgba(255,255,255,.2);background-color:#00000040;border-radius:8px;height:90px;display:flex;align-items:center;justify-content:center;gap:10px}.dev-ad-label{font-size:12px;font-weight:600;color:#fff9;background-color:#ffffff1f;border:1px solid rgba(255,255,255,.2);border-radius:4px;padding:2px 6px;text-transform:uppercase;letter-spacing:.06em}.dev-ad-text{color:#ffffffbf;font-size:14px}@media (max-width: 420px){.dev-ad-inner{height:60px}}.weekly-achievement-overlay{position:fixed;inset:0;background:#000000b3;display:flex;justify-content:center;align-items:center;z-index:9999;animation:fadeIn .3s ease-out}.weekly-achievement-overlay.fade-out{animation:fadeOut .3s ease-out forwards}.weekly-achievement-modal{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:20px;padding:2rem;max-width:500px;width:90%;box-shadow:0 20px 60px #0000004d;animation:slideIn .4s ease-out;position:relative;overflow:hidden}.weekly-achievement-modal:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(255,255,255,.1) 0%,transparent 70%);animation:rotate 20s linear infinite}.weekly-achievement-modal.slide-out{animation:slideOut .3s ease-out forwards}.achievement-header{text-align:center;margin-bottom:1.5rem;position:relative;z-index:1}.achievement-header h2{color:#fff;font-size:2rem;margin:0 0 .5rem;text-shadow:2px 2px 4px rgba(0,0,0,.2);animation:pulse 2s ease-in-out infinite}.week-label{color:#ffffffe6;font-size:1.1rem;margin:0}.achievement-content{background:#fffffff2;border-radius:15px;padding:1.5rem;position:relative;z-index:1}.achievement-intro{text-align:center;color:#333;font-size:1.1rem;margin:0 0 1.5rem;font-weight:600}.achievement-list{display:flex;flex-direction:column;gap:1rem;margin-bottom:1.5rem}.achievement-item{display:flex;align-items:center;background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff;padding:1rem;border-radius:10px;box-shadow:0 4px 15px #0000001a;animation:slideInFromRight .5s ease-out backwards}.achievement-item:nth-child(1){animation-delay:.1s}.achievement-item:nth-child(2){animation-delay:.2s}.achievement-item:nth-child(3){animation-delay:.3s}.achievement-rank{font-size:1.5rem;font-weight:700;margin-right:1rem;min-width:50px;text-shadow:2px 2px 4px rgba(0,0,0,.2)}.achievement-category{flex:1;font-size:1.1rem;font-weight:600}.achievement-value{font-size:1.1rem;font-weight:700;text-align:right}.achievement-settings-button{display:block;margin:1rem auto 0;padding:.5rem 1.5rem;background:#8b5cf699;color:#fff;border:2px solid rgba(255,255,255,.4);border-radius:20px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .3s ease;position:relative;z-index:1;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.achievement-settings-button:hover{background:#8b5cf6bf;border-color:#fff9;transform:scale(1.05);box-shadow:0 4px 12px #8b5cf64d}.achievement-settings-button:active{background:#8b5cf6bf;border-color:#fff9;transform:scale(.98);box-shadow:0 2px 6px #8b5cf64d}.dismiss-button{display:block;margin:1.5rem auto 0;padding:.75rem 2rem;background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff;border:none;border-radius:25px;font-size:1.1rem;font-weight:700;cursor:pointer;box-shadow:0 4px 15px #f093fb66;transition:all .3s ease;position:relative;z-index:1}.dismiss-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #f093fb99}.dismiss-button:active{transform:translateY(0)}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes slideIn{0%{transform:translateY(-50px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slideOut{0%{transform:translateY(0);opacity:1}to{transform:translateY(50px);opacity:0}}@keyframes slideInFromRight{0%{transform:translate(50px);opacity:0}to{transform:translate(0);opacity:1}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 480px){.weekly-achievement-modal{padding:1.5rem}.achievement-header h2{font-size:1.5rem}.achievement-item{padding:.75rem}.achievement-rank{font-size:1.25rem;min-width:40px}.achievement-category,.achievement-value{font-size:1rem}}.legal-page{min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);padding:20px;color:#fff}.legal-content{max-width:800px;margin:0 auto;background:#0000004d;border-radius:15px;padding:30px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.legal-page h1{font-size:2.5rem;margin-bottom:10px;text-align:center;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.legal-page h2{font-size:1.5rem;margin-top:30px;margin-bottom:15px;color:gold;border-bottom:2px solid rgba(255,215,0,.3);padding-bottom:5px}.legal-page p{line-height:1.6;margin-bottom:15px}.legal-page ul{margin-left:20px;margin-bottom:15px}.legal-page li{margin-bottom:8px;line-height:1.5}.legal-page section{margin-bottom:30px}.last-updated{text-align:center;font-style:italic;color:#fffc;margin-bottom:30px}.close-button{position:absolute;top:20px;right:20px;background:#ffffff1a;border:2px solid rgba(255,255,255,.3);color:#fff;width:40px;height:40px;border-radius:50%;font-size:32px;font-weight:400;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;line-height:0;padding:0 0 4px}.close-button:hover{background:#fff3;transform:scale(1.1)}.bottom-close-button{display:block;margin:30px auto 0;background:#fff3;border:2px solid rgba(255,255,255,.4);color:#fff;padding:12px 40px;border-radius:8px;font-size:16px;font-weight:700;cursor:pointer;transition:background .3s ease,border-color .3s ease}.bottom-close-button:hover{background:#ffffff4d;border-color:#fff9}.app-footer{background:#0000004d;padding:20px;text-align:center;margin-top:50px;border-top:1px solid rgba(255,255,255,.2)}.footer-links{display:flex;justify-content:center;gap:30px;margin-bottom:15px;flex-wrap:wrap}.footer-link{color:#ffffffe6;text-decoration:none;font-size:14px;transition:color .3s ease;cursor:pointer}.footer-link:hover{color:gold;text-decoration:underline}.footer-divider{margin:0 10px;color:#fff6}.footer-copyright{color:#ffffffb3;font-size:12px;margin-top:10px}@media (max-width: 768px){.legal-content{padding:20px}.legal-page h1{font-size:2rem}.legal-page h2{font-size:1.3rem}.footer-links{flex-direction:column;gap:10px}.footer-divider{display:none}}.install-banner{position:fixed;top:0;left:0;right:0;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:12px 16px;z-index:1000;box-shadow:0 2px 10px #0000001a;animation:slideDown .3s ease-out}@keyframes slideDown{0%{transform:translateY(-100%)}to{transform:translateY(0)}}.install-banner-content{max-width:600px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}.install-banner-text{font-size:14px;font-weight:500}.install-banner-buttons{display:flex;gap:8px}.install-banner-btn{padding:6px 16px;border:none;border-radius:4px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.install-btn-primary{background:#fff;color:#667eea}.install-btn-primary:hover{background:#f8f8f8}.install-btn-secondary{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.3)}.install-btn-secondary:hover{background:#ffffff1a}@media (max-width: 480px){.install-banner-content{flex-direction:column;text-align:center}.install-banner-buttons{width:100%;justify-content:center}}.ios-install-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:10000;padding:20px;animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.ios-install-modal{background:#fff;border-radius:16px;max-width:400px;width:100%;padding:24px;position:relative;animation:slideUp .3s ease-out;max-height:90vh;overflow-y:auto}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.ios-install-close{position:absolute;top:16px;right:16px;background:none;border:none;font-size:28px;color:#999;cursor:pointer;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s ease}.ios-install-close:hover{background:#f0f0f0;color:#666}.ios-install-title{margin:0 0 8px;font-size:24px;color:#333;text-align:center}.ios-install-subtitle{color:#666;text-align:center;margin:0 0 24px;font-size:14px}.ios-install-steps{display:flex;flex-direction:column;gap:16px;margin-bottom:24px}.ios-install-step{display:flex;align-items:flex-start;gap:12px}.ios-install-step-number{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex-shrink:0}.ios-install-step-text{flex:1;color:#333;font-size:15px;line-height:1.5;padding-top:3px}.ios-install-step-text strong{color:#667eea;font-weight:600}.ios-share-icon{display:inline-block;vertical-align:middle;margin:0 4px}.ios-install-note{background:#f8f9fa;border-radius:8px;padding:12px;margin-bottom:20px}.ios-install-note p{margin:0;font-size:13px;color:#666;text-align:center}.ios-install-done{width:100%;padding:12px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.ios-install-done:hover{transform:translateY(-1px);box-shadow:0 4px 12px #667eea4d}.ios-install-done:active{transform:translateY(0)}@media (max-width: 380px){.ios-install-modal{padding:20px}.ios-install-title{font-size:20px}.ios-install-step-text{font-size:14px}}
