.project-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;z-index:1000;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}.project-modal-overlay.active{opacity:1;visibility:visible}.project-modal{background:var(--ip-white,#fff);border:var(--stroke);border-radius:var(--radius-head);box-shadow:var(--shadow-hard);width:95%;max-width:650px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;position:relative}.project-modal-overlay.active .project-modal{animation:pmSlideIn .3s ease}@keyframes pmSlideIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.modal-close-button,.project-modal-close{width:36px;height:36px;background:var(--ip-white,#fff);border:2px solid var(--ip-black,#1a1a1a);border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--ip-black,#1a1a1a);box-shadow:3px 3px 0 var(--ip-black);transition:all .2s ease;flex-shrink:0;padding:0}.modal-close-button:hover,.project-modal-close:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--ip-black)}.modal-close-button:active,.project-modal-close:active{transform:translate(1px,1px);box-shadow:1px 1px 0 var(--ip-black)}.project-modal-content{display:flex;flex:1;overflow:hidden;min-height:0;border-bottom:2px solid var(--ip-black,#1a1a1a)}.project-modal-left{width:50%;min-width:220px;background:var(--bg-color,#e6f4fa);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.project-cover-img{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .3s ease}.project-modal-left:hover .project-cover-img{transform:scale(1.05)}.project-modal-left:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.4);opacity:0;transition:opacity .3s ease;z-index:1;pointer-events:none}.project-modal-left:hover:before{opacity:1}.project-cover-enter-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(.8);display:flex;align-items:center;gap:6px;padding:10px 24px;background:var(--ip-blue,#2ca5e0);border:2px solid var(--ip-black,#1a1a1a);border-radius:12px;color:#fff;font-family:Fredoka,sans-serif;font-size:15px;font-weight:700;cursor:pointer;box-shadow:4px 4px 0 var(--ip-black);opacity:.5;transition:all .3s ease;z-index:2;white-space:nowrap}.project-cover-enter-btn i{font-size:20px}.project-modal-left:hover .project-cover-enter-btn{opacity:1;transform:translate(-50%,-50%)}.project-cover-enter-btn:hover{transform:translate(-52%,-52%);box-shadow:6px 6px 0 var(--ip-black)}.project-modal-right{flex:1;min-width:0;padding:20px 16px 12px;display:flex;flex-direction:column;gap:12px}.pm-header{display:flex;justify-content:space-between;align-items:center;gap:12px}.pm-title{font-family:Fredoka,sans-serif;font-size:20px;font-weight:700;color:var(--ip-black,#1a1a1a);margin:0;line-height:1.3}.pm-creator{display:flex;align-items:center;gap:12px;padding:8px 0}.pm-creator-avatar{width:52px;height:52px;border-radius:50%;border:2px solid var(--ip-black,#1a1a1a);overflow:hidden}.pm-creator-details{flex:1;display:flex;flex-direction:column;gap:4px}.pm-creator-top{display:flex;align-items:center;gap:8px}.pm-creator-name{font-family:Fredoka,sans-serif;font-size:15px;font-weight:600;color:var(--ip-black,#1a1a1a)}.pm-creator-label{font-size:12px;color:#666}.pm-stats{display:flex;gap:16px}.pm-stat-item{display:flex;align-items:center;gap:4px;padding:4px 8px;background:var(--ip-white,#fff);border:2px solid var(--ip-black,#1a1a1a);border-radius:8px;cursor:pointer;box-shadow:2px 2px 0 var(--ip-black);transition:all .2s ease}.pm-stat-item:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--ip-black)}.pm-stat-item:active{transform:translate(1px,1px);box-shadow:1px 1px 0 var(--ip-black)}.pm-stat-item svg{width:14px;height:14px;color:var(--ip-blue,#2ca5e0);transition:color .2s ease}.pm-stat-item .heart-icon{color:var(--ip-red,#ff4d4d)}.pm-stat-count{font-family:Fredoka,sans-serif;font-size:12px;font-weight:600;color:var(--ip-black,#1a1a1a)}.pm-stat-label{font-size:11px;color:#666}.pm-description{flex-shrink:0}.pm-description h3{font-family:Fredoka,sans-serif;font-size:14px;font-weight:600;color:var(--ip-black,#1a1a1a);margin:0 0 4px}.pm-description p{font-size:13px;line-height:1.5;color:#333;margin:0}.pm-comments-section{padding:4px 8px;background:var(--ip-white,#fff);display:flex;flex-direction:column;overflow:hidden;flex-shrink:0;flex:1;min-height:180px;max-height:400px}.pm-comments-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;flex-shrink:0}.pm-comments-header h3{font-family:Fredoka,sans-serif;font-size:16px;font-weight:600;color:var(--ip-black,#1a1a1a);margin:0}.pm-comment-count{color:var(--ip-blue,#2ca5e0)}.pm-sort-tabs{display:flex;gap:8px}.pm-sort-tabs button{padding:4px 12px;border:2px solid transparent;border-radius:8px;background-color:#f0f0f0;color:#666;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease}.pm-sort-tabs button:hover{background-color:#e0e0e0;color:#333}.pm-sort-tabs button.active{background-color:var(--ip-blue,#2ca5e0);color:#fff;border-color:var(--ip-black,#1a1a1a);box-shadow:2px 2px 0 var(--ip-black)}.pm-comment-input-area{display:flex;gap:10px;margin-bottom:12px;flex-shrink:0}.pm-user-avatar{width:36px;height:36px;border-radius:50%;border:2px solid var(--ip-black,#1a1a1a);flex-shrink:0;overflow:hidden}.pm-comment-input-wrapper{flex:1;display:flex;gap:6px}.pm-comment-input-wrapper input{flex:1;padding:10px 14px;border:2px solid var(--ip-black,#1a1a1a);border-radius:10px;font-family:Fredoka,sans-serif;font-size:13px;background:var(--ip-white,#fff);box-shadow:2px 2px 0 var(--ip-black);transition:all .2s ease}.pm-comment-input-wrapper input:focus{outline:none;box-shadow:4px 4px 0 var(--ip-black)}.pm-comment-submit-btn{width:40px;height:40px;background:var(--ip-blue,#2ca5e0);border:2px solid var(--ip-black,#1a1a1a);border-radius:10px;color:#fff;font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:2px 2px 0 var(--ip-black);transition:all .2s ease}.pm-comment-submit-btn:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ip-black)}.pm-comment-submit-btn:active{transform:translate(1px,1px);box-shadow:1px 1px 0 var(--ip-black)}.pm-comments-list{display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;flex:1;min-height:0;padding-right:4px;flex-shrink:1}.pm-comments-list::-webkit-scrollbar{width:6px}.pm-comments-list::-webkit-scrollbar-track{background:var(--bg-color,#e6f4fa);border-radius:3px}.pm-comments-list::-webkit-scrollbar-thumb{background:silver;border-radius:3px;border:1px solid #a0a0a0}.pm-comments-list::-webkit-scrollbar-thumb:hover{background:#999}.pm-comment-item{display:flex;gap:10px;padding:12px 0;border-bottom:1px solid var(--ip-black,#1a1a1a)}.pm-comment-item:last-child{border-bottom:none}.pm-comment-avatar{width:36px;height:36px;border-radius:50%;border:2px solid var(--ip-black,#1a1a1a);flex-shrink:0;overflow:hidden}.pm-comment-content{flex:1;min-width:0;display:flex;flex-direction:column}.pm-comment-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2px;gap:8px}.pm-comment-author{font-family:Fredoka,sans-serif;font-size:13px;font-weight:600;color:var(--ip-black,#1a1a1a)}.pm-comment-time{font-size:11px;color:#999;flex-shrink:0}.pm-comment-text{font-size:13px;line-height:1.4;color:#333;margin:0;word-break:break-word}.pm-comment-body{display:flex;flex-direction:column;gap:8px}.pm-comment-actions{display:flex;flex-direction:row;align-items:flex-start;gap:8px;flex-shrink:0}.pm-action-item{display:flex;align-items:center;gap:6px;font-size:12px;color:#666;background:none;border:none;padding:2px;cursor:pointer;transition:color .2s ease}.pm-action-item:hover{color:var(--ip-blue,#2ca5e0)}.pm-action-item.is-liked{color:var(--ip-red,#ff4d4d)}@media (max-width:768px){.project-modal{width:95%;max-height:90vh;max-width:none}.project-modal,.project-modal-content{flex-direction:column}.project-modal-left{width:100%;height:0;padding-bottom:66.67%;min-width:auto;position:relative}.project-cover-img{position:absolute;top:0;left:0;width:100%;height:100%}.project-modal-right{max-height:none}.pm-comments-section{max-height:40%;min-height:120px}.pm-comments-list{max-height:150px}}