.post-page{background-color:var(--background-color,#f0f0f5);box-sizing:border-box;margin:0;padding:32px 16px;font-family:sans-serif}.post-container{box-sizing:border-box;background:var(--background-color,#fff);border-radius:8px;flex-direction:column;justify-content:flex-start;align-items:stretch;width:100%;max-width:900px;margin:0 auto;padding:24px 24px 120px;display:flex;overflow:visible}.post-container h2{color:#4a5568;margin-bottom:25px}.post-container .upload-label{color:#fff;cursor:pointer;background-color:#5a67d8;border-radius:8px;margin-bottom:20px;padding:20px;font-size:1.1em;font-weight:700;display:block}.post-container .preview-image{object-fit:contain;border:2px solid #5a67d8;border-radius:8px;max-width:100%;max-height:60vh;margin-bottom:20px}.post-container .caption-area{text-align:left;margin-bottom:20px}.post-container textarea{resize:vertical;box-sizing:border-box;border:1px solid #ccc;border-radius:4px;width:100%;min-height:80px;padding:10px}.post-container #submit-button{color:#fff;cursor:pointer;background-color:#38a169;border:none;border-radius:8px;width:100%;padding:15px;font-size:1.2em}.post-container #submit-button:disabled{cursor:not-allowed;background-color:#bee3f8}.loading-overlay{z-index:4000;background:rgba(255,255,255,.9);flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:fixed;top:0;left:0}.post-container .photo-area .preview-image{object-fit:contain;max-width:100%;max-height:60vh}.result-modal-overlay{z-index:2000;background:rgba(0,0,0,.75);justify-content:center;align-items:center;width:100%;height:100%;animation:.3s ease-out fadeIn;display:flex;position:fixed;top:0;left:0}.result-modal-card{text-align:center;background:#fff;border-radius:16px;width:90%;max-width:400px;padding:30px;animation:.3s cubic-bezier(.175,.885,.32,1.27) forwards popIn;position:relative;overflow:hidden;transform:scale(.9);box-shadow:0 12px 30px rgba(0,0,0,.3)}.close-button{cursor:pointer;color:#666;background:0 0;border:none;font-size:18px;position:absolute;top:10px;right:10px}.result-icon{margin-bottom:15px;font-size:48px;animation:1.5s infinite pulse}.result-title{color:#1a202c;margin-bottom:10px;font-size:24px;font-weight:700}.result-emotion{color:#4a5568;background:#f0f4f8;border-radius:8px;margin-bottom:25px;padding:8px 15px;font-size:16px;display:inline-block}.result-emotion span{color:#5a67d8;font-weight:700}.ai-comment-box{background:#f7fbf8;border-left:4px solid #38a169;border-radius:10px;margin-bottom:30px;padding:15px}.ai-comment-label{color:#4a5568;margin-bottom:5px;font-size:13px;font-weight:600}.ai-comment-text{color:#1a202c;margin:0;font-size:18px;font-weight:500;line-height:1.5}.ok-button{color:#fff;cursor:pointer;background-color:#38a169;border:none;border-radius:8px;padding:12px 24px;font-size:16px;transition:background-color .2s}.ok-button:hover{background-color:#2f855a}.emotion-happy{background:linear-gradient(135deg,#fffde7,#ffecb3)}.emotion-happy .result-emotion span{color:#ff9800}.emotion-happy .ai-comment-box{background:#fffbe6;border-left-color:#ff9800}.emotion-sad{background:linear-gradient(135deg,#e3f2fd,#bbdefb)}.emotion-sad .result-icon{color:#1e88e5;animation:none}.emotion-sad .result-emotion span{color:#1e88e5}.emotion-sad .ai-comment-box{background:#eef7ff;border-left-color:#1e88e5}.emotion-anger{background:linear-gradient(135deg,#ffebee,#ffcdd2)}.emotion-anger .result-icon{color:#e53935;animation:.5s infinite shake}.emotion-anger .result-emotion span{color:#e53935}.emotion-anger .ai-comment-box{background:#fff4f5;border-left-color:#e53935}.emotion-calm{background:linear-gradient(135deg,#e8f5e9,#c8e6c9)}.emotion-calm .result-icon{color:#43a047;animation:4s ease-in-out infinite gentleFloat}.emotion-calm .result-emotion span{color:#43a047}.emotion-calm .ai-comment-box{background:#f3fff4;border-left-color:#43a047}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes popIn{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-5px)}40%,80%{transform:translate(5px)}}@keyframes gentleFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}