@import"https://fonts.googleapis.com/css2?family=Schoolbell&display=swap";*{margin:0;padding:0;box-sizing:border-box}html,body{margin:0;padding:0;width:100%;height:100%}#app{width:100%;height:100%;overflow:hidden;-webkit-user-select:none;user-select:none}.app-container{position:relative;min-height:100vh;height:100vh;overflow:hidden;background:linear-gradient(135deg,#4e74b2,#0d2958);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;color:#fff}.header{position:fixed;top:0;left:0;right:0;height:120px;display:flex;align-items:center;justify-content:center;z-index:10;background:linear-gradient(180deg,#4e74b2e6,#4e74b200)}h1{font-size:3rem;margin:0;text-shadow:2px 2px 4px rgba(0,0,0,.5)}.title-clickable{cursor:pointer;-webkit-user-select:none;user-select:none}.rainbow-mode{background:linear-gradient(90deg,red,#ff7f00,#ff0,#0f0,#00f,indigo,#9400d3,red);background-size:300% 100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:rainbowShift 3s linear infinite;filter:drop-shadow(2px 2px 4px rgba(0,0,0,.5))}@keyframes rainbowShift{0%{background-position:0% center}to{background-position:300% center}}.rainbow-icon{animation:rainbowRotate 2s linear infinite;filter:saturate(1.5) brightness(1.1)}@keyframes rainbowRotate{0%{filter:saturate(1.5) brightness(1.1) hue-rotate(0deg)}25%{filter:saturate(1.5) brightness(1.1) hue-rotate(90deg)}50%{filter:saturate(1.5) brightness(1.1) hue-rotate(180deg)}75%{filter:saturate(1.5) brightness(1.1) hue-rotate(270deg)}to{filter:saturate(1.5) brightness(1.1) hue-rotate(360deg)}}.main-content{position:fixed;top:120px;left:0;right:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 20px;overflow:hidden}.footer{position:fixed;bottom:0;left:0;right:0;height:140px;display:flex;align-items:center;justify-content:center;z-index:10;background:linear-gradient(0deg,#0d2958e6,#0d295800)}.button-container{display:flex;justify-content:center;align-items:center;width:100%;height:100%;flex-direction:column}.button-container img{margin-bottom:5vh;width:20vh;height:auto}.user-name{margin-top:1em}.show-button{padding:20px 60px;font-size:1.5rem;background:#fff;color:#1e3a8a;border:none;border-radius:50px;cursor:pointer;box-shadow:0 10px 30px #0000004d;transition:all .3s ease;font-weight:700}.show-button:hover{transform:translateY(-2px);box-shadow:0 15px 40px #0006}.show-button:active{transform:translateY(0)}.show-button:disabled{opacity:.6;cursor:not-allowed}.show-button:disabled:hover{transform:none;box-shadow:0 10px 30px #0000004d}.offline-message{font-size:1.5rem;color:#6b7280;background-color:#f3f4f6;padding:1rem 2rem;border-radius:.5rem;border:2px solid #d1d5db;font-weight:500;text-align:center;margin:1rem 0;animation:pulse-opacity 2s ease-in-out infinite}@keyframes pulse-opacity{0%,to{opacity:1}50%{opacity:.7}}.error-message{margin-top:16px;padding:12px 20px;background:#ef444433;border:1px solid rgba(239,68,68,.4);border-radius:8px;color:#fecaca;font-size:.9rem;text-align:center}.error-link{display:inline-block;margin-top:8px;color:#fff;text-decoration:underline;font-weight:700;transition:color .2s ease}.error-link:hover{color:#fecaca}.icons-display{display:grid;gap:10px;padding:20px;background:#2222226b;border-radius:20px;align-content:flex-start;justify-content:space-between;width:100%;max-width:600px;overflow:hidden;align-items:stretch}.hart-item{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;flex-grow:0;animation:popIn .1s cubic-bezier(.68,-.55,.265,1.55)}.hart-item i{font-weight:700}.milestone-trophy{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;flex-grow:0;animation:dropIn .8s cubic-bezier(.34,1.56,.64,1);filter:drop-shadow(0 0 2px rgba(255,255,255,.6))}.completion-indicator{font-size:1.2rem;font-weight:700;padding:20px 40px;background:#ffffff1a;border-radius:10px;animation:fadeIn .5s ease;text-align:center}.info-box{margin-top:16px;font-size:1.1rem;font-family:Schoolbell,cursive;padding:4px;background:#fffffff2;color:#1e3a8a;border-radius:12px;text-align:center;max-width:500px;width:90%;box-shadow:0 4px 12px #0000004d;white-space:balance}.info-box-voice{background-color:#1e40af!important;color:#fff}.info-box-mind{background-color:#a16207!important;color:#fff}.info-box-heart{background-color:#b91c1c!important;color:#fff}.info-box-growth{background-color:#15803d!important;color:#fff}.info-box-commitment{background-color:#0e7490!important;color:#fff}.info-box-action{background-color:#a21caf!important;color:#fff}.info-box-milestone-25{background-color:#6b7280!important;color:#fff}.info-box-milestone-50{background-color:#4b5563!important;color:#fff}.info-box-milestone-75{background-color:#c2410c!important;color:#fff}.info-box-milestone-100{background-color:#1f2937!important;color:#fff}.info-box-milestone-200{background-color:#b45309!important;color:#fff}.info-box-milestone-300{background-color:#111827!important;color:#fff}.info-box-milestone-500{background-color:#000!important;color:#fff}.info-box-harmony{background:linear-gradient(135deg,#667eea,#764ba2)!important;color:#fff;font-size:1.1rem;box-shadow:0 0 20px #667eea99,0 4px 12px #0000004d!important;animation:harmonyPulse .6s ease-out}@keyframes harmonyPulse{0%{transform:scale(.95);box-shadow:0 0 20px #667eeacc,0 4px 12px #0000004d}50%{transform:scale(1.05);box-shadow:0 0 30px #667eea,0 4px 12px #0000004d}to{transform:scale(1);box-shadow:0 0 20px #667eea99,0 4px 12px #0000004d}}.clickable-icon{cursor:pointer;transition:transform .2s ease}.clickable-icon:hover{transform:scale(1.1)}.clickable-icon:active{transform:scale(.95)}.stats-line{margin-bottom:8px}.milestones-line{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:8px}.count-number{display:inline-block}.milestone-icon-display{font-size:1.5rem;filter:drop-shadow(0 0 4px rgba(255,255,255,.4))}@keyframes popIn{0%{opacity:0;transform:scale(.5) rotate(-30deg)}50%{transform:scale(1.1)}to{opacity:1;transform:scale(1) rotate(0)}}@keyframes dropIn{0%{transform:translateY(-200px);opacity:0}60%{transform:translateY(10px);opacity:1}80%{transform:translateY(-5px)}to{transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fade-enter-active,.fade-leave-active{transition:opacity .3s ease}.fade-enter-from,.fade-leave-to{opacity:0}.color-heart{color:#ef4444}.color-mind{color:#eab308}.color-growth{color:#22c55e}.color-voice{color:#3b82f6}.color-commitment{color:#06b6d4}.color-action{color:#d946ef}.color-milestone-25{color:#ddd}.color-milestone-50{color:#eee}.color-milestone-75{color:#ffa54c}.color-milestone-100{color:#fff}.color-milestone-200{color:#fbbf24}.color-milestone-300{color:#e5e7eb}.color-milestone-500{color:#fff}@media (max-width: 768px){.header{height:80px}h1{font-size:2rem}.main-content{top:80px}.footer{height:120px}.show-button{padding:15px 40px;font-size:1.2rem}.completion-indicator{font-size:1rem;padding:15px 30px}}.v-popper--theme-tooltip .v-popper__inner{font-family:Irish Grover,cursive;font-size:1rem;padding:10px 14px;border-radius:8px;max-width:250px}.tooltip-voice .v-popper__inner{background-color:#1e40af!important;color:#fff}.tooltip-voice .v-popper__arrow-inner{border-color:#1e40af!important}.tooltip-mind .v-popper__inner{background-color:#a16207!important;color:#fff}.tooltip-mind .v-popper__arrow-inner{border-color:#a16207!important}.tooltip-heart .v-popper__inner{background-color:#b91c1c!important;color:#fff}.tooltip-heart .v-popper__arrow-inner{border-color:#b91c1c!important}.tooltip-growth .v-popper__inner{background-color:#15803d!important;color:#fff}.tooltip-growth .v-popper__arrow-inner{border-color:#15803d!important}.tooltip-commitment .v-popper__inner{background-color:#0e7490!important;color:#fff}.tooltip-commitment .v-popper__arrow-inner{border-color:#0e7490!important}.tooltip-action .v-popper__inner{background-color:#a21caf!important;color:#fff}.tooltip-action .v-popper__arrow-inner{border-color:#a21caf!important}.tooltip-milestone-25 .v-popper__inner{background-color:#6b7280!important;color:#fff}.tooltip-milestone-25 .v-popper__arrow-inner{border-color:#6b7280!important}.tooltip-milestone-50 .v-popper__inner{background-color:#4b5563!important;color:#fff}.tooltip-milestone-50 .v-popper__arrow-inner{border-color:#4b5563!important}.tooltip-milestone-75 .v-popper__inner{background-color:#c2410c!important;color:#fff}.tooltip-milestone-75 .v-popper__arrow-inner{border-color:#c2410c!important}.tooltip-milestone-100 .v-popper__inner{background-color:#1f2937!important;color:#fff}.tooltip-milestone-100 .v-popper__arrow-inner{border-color:#1f2937!important}.tooltip-milestone-200 .v-popper__inner{background-color:#b45309!important;color:#fff}.tooltip-milestone-200 .v-popper__arrow-inner{border-color:#b45309!important}.tooltip-milestone-300 .v-popper__inner{background-color:#111827!important;color:#fff}.tooltip-milestone-300 .v-popper__arrow-inner{border-color:#111827!important}.tooltip-milestone-500 .v-popper__inner{background-color:#000!important;color:#fff}.tooltip-milestone-500 .v-popper__arrow-inner{border-color:#000!important}