:root{font-family:Nunito,"Rounded Mplus 1c",Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.5;font-weight:400;--bg-color: #FDFBF7;--text-main: #5D5D5D;--primary-btn: #FFB7B2;--primary-btn-hover: #FF9E99;--wheel-1: #FFDAC1;--wheel-2: #E2F0CB;--wheel-3: #B5EAD7;--wheel-4: #C7CEEA;color-scheme:light;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,*:before,*:after{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;padding:0;overflow:hidden}body{display:flex;justify-content:center;align-items:center;background-color:var(--bg-color);color:var(--text-main)}#root{width:100%;max-width:80rem;margin:0 auto;text-align:center;padding:1rem;display:flex;flex-direction:column;align-items:center;justify-content:center}button{border-radius:3.125rem;border:none;padding:.8em 2.5em;font-size:1.2em;font-weight:600;font-family:inherit;background-color:var(--primary-btn);color:#fff;cursor:pointer;transition:all .3s ease;box-shadow:0 .25rem .625rem #ffb7b266;display:flex;justify-content:center;align-items:center}button:hover{background-color:var(--primary-btn-hover);transform:translateY(-.125rem);box-shadow:0 .375rem .9375rem #ffb7b299}button:active{transform:translateY(.0625rem)}button:disabled{background-color:#e0e0e0;cursor:not-allowed;transform:none;box-shadow:none}h1{font-size:1.8em;line-height:1.1;color:#ff9aa2;margin-bottom:2rem}.sr-only{position:absolute;width:.0625rem;height:.0625rem;padding:0;margin:-.0625rem;overflow:hidden;clip:rect(0,0,0,0);border:0}.app-container{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;gap:1rem}.wheel-wrapper{margin:1rem 0}.wheel-container{position:relative;width:16rem;height:16rem}@media(max-width:400px){.wheel-container{width:16.25rem;height:16.25rem}}.wheel-pointer{position:absolute;top:-.9375rem;left:50%;transform:translate(-50%);width:2.125rem;height:2.75rem;background:var(--primary-btn);clip-path:polygon(50% 100%,0 0,100% 0);z-index:20;filter:drop-shadow(0 .25rem .25rem rgba(0,0,0,.2))}.wheel{width:100%;height:100%;border-radius:50%;position:relative;overflow:hidden;border:.5rem solid white;box-sizing:border-box;box-shadow:0 .625rem 1.5625rem #0000001a;transition:transform 4s cubic-bezier(.25,.1,.25,1);background:conic-gradient(var(--wheel-1) 0deg 60deg,var(--wheel-2) 60deg 120deg,var(--wheel-3) 120deg 180deg,var(--wheel-1) 180deg 240deg,var(--wheel-2) 240deg 300deg,var(--wheel-3) 300deg 360deg)}.wheel-segment{position:absolute;top:50%;left:50%;width:50%;height:3rem;transform-origin:0% 50%;transform:translateY(-50%) rotate(calc(var(--i) * 60deg - 60deg));display:flex;justify-content:center;align-items:center}.wheel-segment .segment-text{position:relative;white-space:nowrap;font-size:1.25rem;font-weight:700;color:#fff;text-shadow:.0625rem .0625rem .125rem rgba(0,0,0,.1);transform:rotate(90deg)}.modal-overlay{position:fixed;inset:0;background:#0000004d;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:100;animation:fadeIn .3s ease}.modal-content{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#fff;padding:2rem;border-radius:1.25rem;max-width:90%;width:20rem;box-shadow:0 .625rem 2.5rem #0003;animation:popIn .4s cubic-bezier(.175,.885,.32,1.275)}.modal-header{font-size:1.2rem;color:#ff9aa2;margin-bottom:1rem;font-weight:700}.modal-result{font-size:1.5rem;margin:1rem 0;font-weight:700}.result-highlight{color:#ffb7b2;font-size:2rem;display:inline-block;transform:translateY(2px)}.modal-message{color:#888;margin-bottom:2rem;line-height:1.6}.compliment-text{font-size:1.4rem;font-weight:700;color:#a7bed3;display:inline-block;margin:.2rem 0}.lyrics-container{position:relative;min-height:5rem;width:100%;display:flex;align-items:flex-start;justify-content:center;pointer-events:none}.lyrics-display{margin-top:1rem;padding:.5rem 1rem;min-height:2rem;display:flex;align-items:center;justify-content:center;max-width:90%;margin-left:auto;margin-right:auto}.lyric-text{font-size:1rem;color:#b8a0a0;text-align:center;line-height:1.8;font-weight:400;opacity:.75;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;animation:lyricFade 1s ease-in-out}@keyframes lyricFade{0%{opacity:0}to{opacity:.75}}.close-btn{background:var(--wheel-3);color:#fff}.close-btn:hover{background:var(--wheel-2)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes popIn{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}
