.container{width:100%}.flex{display:flex}.inline{display:inline}@layer base{:root{--cat-pink:#ffb6d9;--cat-pink-light:#ffc9e3;--cat-purple:#d5aaff;--cat-yellow:#fff6b6;--cat-blue:#b6e7ff;--cat-bg:#fff5f8;--cat-text:#5a4a6a;--cat-card-bg:#ffffffd9;--glass-border:#fff9;--shadow-soft:0 8px 32px #ffb6d933}}*{box-sizing:border-box;margin:0;padding:0}body{color:var(--cat-text);background-color:#0000;background-image:linear-gradient(#ffd1e3 0%,#e8d5ff 50%,#d5aaff 100%),url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.2'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");background-position:0 0;background-repeat:repeat;background-size:auto;background-attachment:fixed;background-origin:padding-box;background-clip:border-box;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;overflow-x:hidden}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes bounce-gentle{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes popIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes wiggle{0%,to{transform:rotate(0)}25%{transform:rotate(-3deg)}75%{transform:rotate(3deg)}}@keyframes paw-tap{0%{transform:scale(1)}50%{transform:scale(.95)rotate(-5deg)}to{transform:scale(1)}}.container{max-width:480px;min-height:100vh;margin:0 auto;padding:24px 20px}.app-header{text-align:center;margin-bottom:32px;padding-top:20px}.cat-avatar{filter:drop-shadow(0 10px 15px #0000001a);width:140px;height:140px;margin:0 auto 16px;animation:4s ease-in-out infinite float}.app-title{color:#fff;letter-spacing:2px;text-shadow:2px 2px 0px var(--cat-text);-webkit-text-stroke:1px var(--cat-text);margin-bottom:8px;font-size:36px;font-weight:900}.section-header{color:#fff;text-shadow:1px 1px 2px #0000001a;align-items:center;gap:8px;margin-bottom:16px;padding-left:8px;font-size:20px;font-weight:800;display:flex}.cat-emoji{font-size:24px;animation:3s ease-in-out infinite wiggle;display:inline-block}.input-card,.person-card,.result-card,.suggestion-card{background:var(--cat-card-bg);-webkit-backdrop-filter:blur(12px);border:2px solid var(--glass-border);box-shadow:var(--shadow-soft);border-radius:24px;margin-bottom:24px;padding:24px;transition:transform .3s;position:relative}.input-card:hover,.person-card:hover{transform:translateY(-2px)}.person-card{padding:20px}.person-a-card{border-left:6px solid var(--cat-pink)}.person-b-card{border-left:6px solid var(--cat-blue)}.person-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.person-label{color:var(--cat-text);font-size:18px;font-weight:800}.cat-input{width:100%;color:var(--cat-text);background:#ffffffe6;border:2px solid #0000;border-radius:20px;padding:16px 20px;font-size:15px;transition:all .3s;box-shadow:inset 0 2px 4px #00000005}.cat-input:focus{border-color:var(--cat-pink);background:#fff;outline:none;box-shadow:0 0 0 4px #ffb6d933}.cat-input::placeholder{color:#bba0ca}.event-input{resize:vertical;min-height:120px}.compact-input{margin-bottom:12px;padding:12px 16px}.viewpoint-input{resize:vertical;min-height:80px;font-size:14px}.cat-decoration-paw{opacity:.5;pointer-events:none;font-size:24px;position:absolute;bottom:16px;right:16px;transform:rotate(15deg)}.gender-options-compact{background:#ffffff80;border-radius:16px;gap:8px;padding:4px;display:flex}.gender-icon-mini{cursor:pointer;background:0 0;border:none;border-radius:12px;justify-content:center;align-items:center;width:36px;height:36px;font-size:20px;transition:all .2s;display:flex}.gender-icon-mini.selected{background:#fff;transform:scale(1.1);box-shadow:0 2px 8px #0000001a}.submit-button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#ff9eca 0%,#c689ff 100%);border:none;border-radius:24px;justify-content:center;align-items:center;gap:10px;width:100%;min-height:60px;margin-top:32px;padding:18px;font-size:18px;font-weight:800;transition:all .3s;display:flex;position:relative;overflow:hidden;box-shadow:0 8px 20px #ff9eca66}.submit-button:before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);width:100%;height:100%;transition:all .5s;position:absolute;top:0;left:-100%}.submit-button:hover:before{left:100%}.submit-button:hover{transform:translateY(-4px);box-shadow:0 12px 28px #ff9eca80}.submit-button:active{transform:translateY(-1px)}.submit-button:disabled{opacity:.7;cursor:not-allowed;transform:none}.paw-icon{font-size:24px}.loading{border:3px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:24px;height:24px;animation:1s ease-in-out infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.viewpoints-container{flex-direction:column;gap:16px;margin-bottom:24px;display:flex}.viewpoint-card{background:#ffffffe6;border-radius:20px;padding:16px;animation:.5s ease-out popIn;box-shadow:0 4px 12px #0000000d}.person-a-viewpoint{border-bottom-left-radius:4px;margin-right:24px}.person-b-viewpoint{background:#f0f8ff;border-bottom-right-radius:4px;margin-left:24px}.viewpoint-header{color:var(--cat-text);align-items:center;gap:8px;margin-bottom:8px;font-size:14px;font-weight:700;display:flex}.viewpoint-header.right-align{justify-content:flex-end}.avatar{background:#fff;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:24px;display:flex;box-shadow:0 2px 4px #0000001a}.viewpoint-bubble{color:#4a4a4a;font-size:15px;line-height:1.5;position:relative}.result-card-container{animation:.6s ease-out fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.result-card{background:linear-gradient(135deg,#fff0f5 0%,#f3e5f5 100%);border:4px solid #fff;position:relative;overflow:hidden}.cat-ears-decoration{background:var(--cat-pink);z-index:0;opacity:.2;border-radius:50%;width:100px;height:40px;position:absolute;top:-20px;left:50%;transform:translate(-50%)}.result-title{text-align:center;color:var(--cat-text);justify-content:center;align-items:center;gap:10px;margin-bottom:20px;font-size:22px;font-weight:800;display:flex}.judgment-box{color:#4a4a4a;border-left:4px solid var(--cat-purple);background:#ffffffb3;border-radius:16px;margin-bottom:24px;padding:20px;font-size:16px;line-height:1.8}.stats-container{grid-template-columns:1fr 1fr;gap:16px;display:grid}.stat-box{text-align:center;background:#fff;border-radius:16px;padding:16px;box-shadow:0 4px 12px #0000000d}.stat-title{color:#888;text-transform:uppercase;margin-bottom:8px;font-size:13px;font-weight:700}.score-display{justify-content:center;align-items:baseline;gap:4px;display:flex}.score-number{-webkit-text-fill-color:transparent;background:linear-gradient(135deg,#ff6b6b 0%,#ff8e53 100%);-webkit-background-clip:text;font-size:32px;font-weight:900}.score-total{color:#aaa;font-size:12px;font-weight:600}.intimacy-box{grid-column:span 2}.progress-bar-container{background:#f0f0f0;border-radius:10px;width:100%;height:24px;overflow:hidden}.progress-bar{width:100%;height:100%}.progress-fill{color:#fff;background:linear-gradient(90deg,#ff9eca 0%,#c689ff 100%);border-radius:10px;justify-content:center;align-items:center;height:100%;font-size:12px;font-weight:700;transition:width 1s ease-out;display:flex}.suggestion-card{cursor:pointer;background:#fff;border:none;align-items:center;gap:16px;margin:12px 0;padding:16px;display:flex}.suggestion-card:active{transform:scale(.98)}.suggestion-card.completed{filter:grayscale(.5);background:#ffffff80}.suggestion-icon{width:48px;height:48px;color:var(--cat-pink);background:#fff0f5;border-radius:16px;justify-content:center;align-items:center;font-size:24px;display:flex}.suggestion-text{flex:1;font-size:15px;font-weight:600}.suggestion-points{color:var(--cat-pink);background:#fff0f5;border-radius:20px;padding:6px 12px;font-size:13px;font-weight:800}.new-dispute-btn{background:linear-gradient(135deg,#89c4ff 0%,#a089ff 100%);box-shadow:0 8px 20px #89c4ff66}.new-dispute-btn:hover{box-shadow:0 12px 28px #89c4ff80}@media (max-width:375px){.container{padding:16px}.stats-container{grid-template-columns:1fr}.intimacy-box{grid-column:span 1}}.suggestion-tip-box{color:var(--cat-text);border:1px dashed var(--cat-pink);background:#ffb6d926;border-radius:16px;flex-direction:column;gap:4px;margin-bottom:16px;padding:12px 16px;font-size:14px;display:flex}.current-intimacy{color:var(--cat-purple);font-size:15px;font-weight:600}.suggestions-list{flex-direction:column;gap:8px;display:flex}.completion-badge{color:#fff;text-align:center;background:linear-gradient(135deg,#81c784 0%,#66bb6a 100%);border-radius:16px;margin-top:20px;padding:12px;font-weight:700;animation:.5s ease-out popIn;box-shadow:0 4px 12px #81c7844d}