@import"https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&display=swap";*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;font-family:Nunito,sans-serif}:root{--bg-from: #FFF5E0;--bg-to: #E8F0FF;--card-bg: rgba(255, 255, 255, .85);--accent: #7B5EA7;--accent-light: #B49FCC;--accent-dark: #4A2D80;--btn-from: #A07BE0;--btn-to: #6A3FB5;--input-border: #D0BCE8;--input-focus: #9B72D4;--label-color: #7B5EA7;--text-main: #3A2060;--text-sub: #7B5EA7;--error-color: #C0006A;--msg-color: #4A2D80;--heart-fill-a: #A07BE0;--heart-fill-b: #6A3FB5;--heart-empty-a:#EEE0FF;--heart-empty-b:#DDD0F8}body{min-height:100vh;background:linear-gradient(155deg,var(--bg-from) 0%,#FFEEF8 45%,var(--bg-to) 100%);display:flex;align-items:center;justify-content:center;padding:16px;background-image:linear-gradient(155deg,var(--bg-from) 0%,#FFEEF8 45%,var(--bg-to) 100%),repeating-linear-gradient(to bottom,transparent,transparent 31px,rgba(160,123,224,.08) 31px,rgba(160,123,224,.08) 32px);background-blend-mode:normal,multiply}body:before,body:after{content:"";position:fixed;border-radius:50%;pointer-events:none;z-index:0}body:before{width:320px;height:320px;top:-80px;right:-80px;background:radial-gradient(circle,rgba(160,123,224,.12) 0%,transparent 70%)}body:after{width:260px;height:260px;bottom:-60px;left:-60px;background:radial-gradient(circle,rgba(255,180,100,.14) 0%,transparent 70%)}#app{position:relative;z-index:1;width:100%;max-width:480px;background:var(--card-bg);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:28px;padding:36px 32px 44px;box-shadow:0 4px 36px #7b5ea72e,0 1px 4px #0000000f;display:flex;flex-direction:column;align-items:center;gap:20px;border-left:5px solid rgba(224,120,120,.35)}#app:before{content:"✏️";position:absolute;top:-14px;right:20px;font-size:1.8rem;transform:rotate(25deg);filter:drop-shadow(0 2px 4px rgba(0,0,0,.12))}header{text-align:center}h1{font-size:1.9rem;font-weight:900;color:var(--accent-dark);letter-spacing:-.3px;line-height:1.15}.subtitle{margin-top:6px;font-size:.95rem;font-weight:600;color:var(--text-sub)}.stars{font-size:1rem;letter-spacing:3px;margin-top:4px;color:#f0c040}.input-row{width:100%;display:flex;align-items:flex-end;gap:10px}.input-group{flex:1;display:flex;flex-direction:column;gap:6px}label{font-size:.8rem;font-weight:800;color:var(--label-color);text-transform:uppercase;letter-spacing:.05em;padding-left:4px}input[type=text]{width:100%;padding:12px 14px;border:2.5px solid var(--input-border);border-radius:14px;background:#fdfaff;font-family:inherit;font-size:1rem;font-weight:700;color:var(--text-main);outline:none;transition:border-color .2s,box-shadow .2s}input[type=text]::placeholder{color:#c0a8de;font-weight:600}input[type=text]:focus{border-color:var(--input-focus);box-shadow:0 0 0 3px #9b72d42e}.plus-sign{font-size:1.4rem;color:var(--accent-light);padding-bottom:10px;flex-shrink:0;-webkit-user-select:none;user-select:none}.error-msg{width:100%;font-size:.9rem;font-weight:700;color:var(--error-color);background:#c0006a14;border-radius:10px;padding:8px 14px;text-align:center;display:none;margin-top:-8px}.error-msg.visible{display:block}#test-btn{padding:14px 36px;background:linear-gradient(135deg,var(--btn-from) 0%,var(--btn-to) 100%);border:none;border-radius:50px;font-family:inherit;font-size:1.05rem;font-weight:800;color:#fff;cursor:pointer;box-shadow:0 4px 18px #6a3fb561,0 1px 3px #0000001f;transition:transform .12s,box-shadow .12s;letter-spacing:.01em;position:relative}#test-btn:hover{transform:translateY(-2px) scale(1.03);box-shadow:0 7px 24px #6a3fb56b,0 1px 3px #0000001f}#test-btn:active{transform:translateY(0) scale(.97);box-shadow:0 2px 8px #6a3fb547}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}#test-btn.shake{animation:shake .35s ease}#result{width:100%;display:flex;flex-direction:column;align-items:center;gap:14px;position:relative}#heart-wrap{opacity:0;transform:scale(.65);transition:opacity .4s ease,transform .45s cubic-bezier(.34,1.56,.64,1);position:relative}#heart-wrap.visible{opacity:1;transform:scale(1)}#heart-svg{width:160px;height:auto;filter:drop-shadow(0 6px 20px rgba(106,63,181,.32))}#result[data-tier=low] #heart-svg{filter:drop-shadow(0 6px 18px rgba(130,130,190,.28))}#result[data-tier=mid] #heart-svg{filter:drop-shadow(0 6px 18px rgba(160,100,220,.3))}#result[data-tier=high] #heart-svg{filter:drop-shadow(0 6px 20px rgba(106,63,181,.38))}#result[data-tier=perfect] #heart-svg{filter:drop-shadow(0 0 12px rgba(255,210,50,.7)) drop-shadow(0 6px 24px rgba(106,63,181,.45))}#result[data-tier=perfect] #heart-wrap:after{content:"";position:absolute;top:-8px;right:-8px;bottom:-8px;left:-8px;border-radius:50%;background:conic-gradient(gold,orange,gold,orange,gold);z-index:-1;animation:spin-gold 3s linear infinite;opacity:.55;filter:blur(6px)}@keyframes spin-gold{to{transform:rotate(360deg)}}#sparkles{position:absolute;top:50%;left:50%;pointer-events:none}.sparkle-item{position:absolute;font-size:var(--size, 1rem);animation:sparkle-fly 1.2s ease-out var(--delay, 0s) both}@keyframes sparkle-fly{0%{transform:translate(0) scale(.3);opacity:1}70%{opacity:1}to{transform:translate(var(--x),var(--y)) scale(1);opacity:0}}#result-message{font-size:1.05rem;font-weight:700;color:var(--msg-color);text-align:center;line-height:1.55;max-width:340px;min-height:1.6em;opacity:0;transform:translateY(8px);transition:opacity .5s ease,transform .5s ease;display:flex;flex-direction:column;gap:4px}#result-message span{display:block}#result-message.visible{opacity:1;transform:translateY(0)}@media (max-width: 380px){#app{padding:28px 18px 34px}h1{font-size:1.55rem}.input-row{flex-direction:column;align-items:stretch}.plus-sign{text-align:center;padding:0}#test-btn{width:100%}}