@charset "UTF-8";.react-grid-layout{position:relative;transition:height .2s ease}.react-grid-item{transition:all .2s ease;transition-property:left,top,width,height}.react-grid-item img{pointer-events:none;-webkit-user-select:none;user-select:none}.react-grid-item.cssTransforms{transition-property:transform,width,height}.react-grid-item.resizing{transition:none;z-index:1;will-change:width,height}.react-grid-item.react-draggable-dragging{transition:none;z-index:3;will-change:transform}.react-grid-item.dropping{visibility:hidden}.react-grid-item.react-grid-placeholder{background:red;opacity:.2;transition-duration:.1s;z-index:2;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none}.react-grid-item.react-grid-placeholder.placeholder-resizing{transition:none}.react-grid-item>.react-resizable-handle{position:absolute;width:20px;height:20px}.react-grid-item>.react-resizable-handle:after{content:"";position:absolute;right:3px;bottom:3px;width:5px;height:5px;border-right:2px solid rgba(0,0,0,.4);border-bottom:2px solid rgba(0,0,0,.4)}.react-resizable-hide>.react-resizable-handle{display:none}.react-grid-item>.react-resizable-handle.react-resizable-handle-sw{bottom:0;left:0;cursor:sw-resize;transform:rotate(90deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-se{bottom:0;right:0;cursor:se-resize}.react-grid-item>.react-resizable-handle.react-resizable-handle-nw{top:0;left:0;cursor:nw-resize;transform:rotate(180deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-ne{top:0;right:0;cursor:ne-resize;transform:rotate(270deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-w,.react-grid-item>.react-resizable-handle.react-resizable-handle-e{top:50%;margin-top:-10px;cursor:ew-resize}.react-grid-item>.react-resizable-handle.react-resizable-handle-w{left:0;transform:rotate(135deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-e{right:0;transform:rotate(315deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-n,.react-grid-item>.react-resizable-handle.react-resizable-handle-s{left:50%;margin-left:-10px;cursor:ns-resize}.react-grid-item>.react-resizable-handle.react-resizable-handle-n{top:0;transform:rotate(225deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-s{bottom:0;transform:rotate(45deg)}.react-resizable{position:relative}.react-resizable-handle{position:absolute;width:20px;height:20px;background-repeat:no-repeat;background-origin:content-box;box-sizing:border-box;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2IDYiIHN0eWxlPSJiYWNrZ3JvdW5kLWNvbG9yOiNmZmZmZmYwMCIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI2cHgiIGhlaWdodD0iNnB4Ij48ZyBvcGFjaXR5PSIwLjMwMiI+PHBhdGggZD0iTSA2IDYgTCAwIDYgTCAwIDQuMiBMIDQgNC4yIEwgNC4yIDQuMiBMIDQuMiAwIEwgNiAwIEwgNiA2IEwgNiA2IFoiIGZpbGw9IiMwMDAwMDAiLz48L2c+PC9zdmc+);background-position:bottom right;padding:0 3px 3px 0}.react-resizable-handle-sw{bottom:0;left:0;cursor:sw-resize;transform:rotate(90deg)}.react-resizable-handle-se{bottom:0;right:0;cursor:se-resize}.react-resizable-handle-nw{top:0;left:0;cursor:nw-resize;transform:rotate(180deg)}.react-resizable-handle-ne{top:0;right:0;cursor:ne-resize;transform:rotate(270deg)}.react-resizable-handle-w,.react-resizable-handle-e{top:50%;margin-top:-10px;cursor:ew-resize}.react-resizable-handle-w{left:0;transform:rotate(135deg)}.react-resizable-handle-e{right:0;transform:rotate(315deg)}.react-resizable-handle-n,.react-resizable-handle-s{left:50%;margin-left:-10px;cursor:ns-resize}.react-resizable-handle-n{top:0;transform:rotate(225deg)}.react-resizable-handle-s{bottom:0;transform:rotate(45deg)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Pretendard Variable,Pretendard,sans-serif;font-size:14px;line-height:1.5;color:#121212;background-color:#fff}ul,li{list-style:none;padding:0;margin:0}a{text-decoration:none}img,input,button{vertical-align:top}input,button{font-family:Pretendard Variable,Pretendard,sans-serif}button{border:none;background-color:transparent;cursor:pointer}.lb-login-backdrop{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#00000073;z-index:9999;padding:1.25rem}.lb-login-backdrop .lb-login-modal{background:#fff;width:100%;max-width:420px;border-radius:10px;box-shadow:0 8px 24px #02061733;padding:1.5rem;position:relative;transform:translateY(0);transition:all .16s ease}.lb-login-backdrop .lb-login-modal .lb-close{position:absolute;right:.5rem;top:.5rem;background:transparent;border:none;font-size:1.25rem;line-height:1;cursor:pointer}.lb-login-backdrop .lb-login-modal .lb-title{margin:0 0 .75rem;font-size:1.25rem;text-align:center}.lb-login-backdrop .lb-login-modal .lb-form{display:flex;flex-direction:column;gap:.75rem}.lb-login-backdrop .lb-login-modal .lb-form .lb-label{display:flex;flex-direction:column;font-size:.9rem}.lb-login-backdrop .lb-login-modal .lb-form .lb-label input{margin-top:.375rem;padding:.5rem;border:1px solid #ddd;border-radius:6px;font-size:.95rem}.lb-login-backdrop .lb-login-modal .lb-form .lb-error{color:#e74c3c;font-size:.85rem;text-align:center;background-color:#fdf2f2;padding:8px;border-radius:6px;margin-top:4px}.lb-login-backdrop .lb-login-modal .lb-form .lb-submit{margin-top:.25rem;padding:.625rem .75rem;background:#0b69ff;color:#fff;border:none;border-radius:8px;cursor:pointer;font-weight:600}.lb-login-backdrop .lb-login-modal .lb-form .lb-divider{display:flex;align-items:center;margin:.5rem 0;color:#888;font-size:.8rem}.lb-login-backdrop .lb-login-modal .lb-form .lb-divider:before,.lb-login-backdrop .lb-login-modal .lb-form .lb-divider:after{content:"";flex:1;height:1px;background:#eee}.lb-login-backdrop .lb-login-modal .lb-form .lb-divider span{padding:0 10px}.lb-login-backdrop .lb-login-modal .lb-form .social-btn-wrapper{display:flex;gap:10px;align-items:center;justify-content:center}.lb-login-backdrop .lb-login-modal .lb-form .social-btn-wrapper .social-btn{display:flex;align-items:center;justify-content:center;gap:10px;border-radius:8px;padding:.625rem .75rem;cursor:pointer;font-weight:500;transition:background .2s;width:60px}.lb-login-backdrop .lb-login-modal .lb-form .social-btn-wrapper .social-btn.google-btn{background-color:#fff;color:#202124;border:1px solid #dadce0}.lb-login-backdrop .lb-login-modal .lb-form .social-btn-wrapper .social-btn.google-btn:hover{background-color:#f8f9fa;box-shadow:0 1px 3px #3c40434d}.lb-login-backdrop .lb-login-modal .lb-form .social-btn-wrapper .social-btn.kakao-btn{background-color:#fee500;color:#000;border:none}.lb-login-backdrop .lb-login-modal .lb-form .social-btn-wrapper .social-btn.kakao-btn:hover{background-color:#f7e600;box-shadow:0 1px 3px #0003}.lb-login-backdrop .lb-login-modal .lb-form .social-btn-wrapper .social-btn.kakao-btn .kakao-icon-wrapper{display:flex;align-items:center;justify-content:center;width:18px;height:18px}.lb-login-backdrop .lb-login-modal .lb-form .social-btn-wrapper .social-btn.naver-btn{background-color:#03c75a;color:#fff;border:none}.lb-login-backdrop .lb-login-modal .lb-form .social-btn-wrapper .social-btn.naver-btn:hover{background-color:#02b351;box-shadow:0 1px 3px #0003}.lb-login-backdrop .lb-login-modal .lb-form .social-btn-wrapper .social-btn.naver-btn .naver-icon-wrapper{display:flex;align-items:center;justify-content:center;width:36px;height:36px}.lb-login-backdrop .lb-login-modal .lb-form .social-btn-wrapper .social-btn img{width:36px;height:36px}.lb-login-backdrop .lb-login-modal .lb-sign-info{display:flex;justify-content:space-between;margin-top:10px}@media(max-width:480px){.lb-login-backdrop{padding:.75rem}.lb-login-backdrop .lb-login-modal{padding:1rem;border-radius:8px}}.user-info-modal-backdrop{position:fixed;inset:0;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000000;animation:modal-fade-in .2s ease-out}.user-info-modal-backdrop .user-info-modal{background:#fefefe;border-radius:16px;width:90%;max-width:480px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px #0000004d;animation:modal-slide-up .3s ease-out}.user-info-modal-backdrop .user-info-modal .modal-header{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-bottom:1px solid #e1e8ed;background-color:#dbdce0}.user-info-modal-backdrop .user-info-modal .modal-header h3{margin:0;font-size:20px;font-weight:700;color:#14171a}.user-info-modal-backdrop .user-info-modal .modal-header .close-button{cursor:pointer;width:30px;height:30px;display:flex;align-items:center;justify-content:center;text-align:center;text-indent:-9999px;overflow:hidden}.user-info-modal-backdrop .user-info-modal .modal-header .close-button:after{content:"";display:inline-block;width:15px;height:15px;background-color:red;border-radius:50%;text-indent:0;transition:all .3s ease}.user-info-modal-backdrop .user-info-modal .modal-header .close-button:hover:after{content:"x";color:#fff;font-size:15px;line-height:13px;background-color:#cd0000}.user-info-modal-backdrop .user-info-modal .modal-content{position:relative;padding:24px}.user-info-modal-backdrop .user-info-modal .modal-content .user-profile-section{position:relative;display:flex;gap:16px;margin-bottom:24px}.user-info-modal-backdrop .user-info-modal .modal-content .user-profile-section .profile-image{flex-shrink:0}.user-info-modal-backdrop .user-info-modal .modal-content .user-profile-section .profile-image img{width:80px;height:80px;border-radius:50%;object-fit:cover;border:3px solid #e1e8ed}.user-info-modal-backdrop .user-info-modal .modal-content .user-profile-section .profile-image p{display:none}.user-info-modal-backdrop .user-info-modal .modal-content .user-profile-section .profile-image:hover p{position:absolute;top:0;left:0;display:flex;width:80px;height:80px;opacity:.6;border-radius:50%;justify-content:center;background-color:#121212;color:#fff;align-items:center}.user-info-modal-backdrop .user-info-modal .modal-content .user-profile-section .user-details{flex:1}.user-info-modal-backdrop .user-info-modal .modal-content .user-profile-section .user-details .user-nickname{margin:0 0 4px;font-size:20px;font-weight:700;color:#14171a}.user-info-modal-backdrop .user-info-modal .modal-content .user-profile-section .user-details .user-id{margin:0 0 8px;font-size:14px;color:#657786}.user-info-modal-backdrop .user-info-modal .modal-content .user-profile-section .user-details .user-email{margin:0 0 12px;font-size:14px;color:#657786}.user-info-modal-backdrop .user-info-modal .modal-content .user-profile-section .user-details .user-introduction{margin:0 0 12px;font-size:15px;line-height:1.4;color:#14171a;background:#f7f9fa;padding:12px;border-radius:8px}.user-info-modal-backdrop .user-info-modal .modal-content .user-profile-section .user-details .user-dates .join-date{font-size:13px;color:#657786}.user-info-modal-backdrop .user-info-modal .modal-content .action-buttons{display:flex;gap:12px}.user-info-modal-backdrop .user-info-modal .modal-content .action-buttons button{flex:1;padding:12px 24px;border-radius:24px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s ease;border:1px solid}.user-info-modal-backdrop .user-info-modal .modal-content .action-buttons .follow-button{background-color:#1d9bf0;color:#fff;border-color:#1d9bf0}.user-info-modal-backdrop .user-info-modal .modal-content .action-buttons .follow-button:hover{background-color:#1a8cd8;border-color:#1a8cd8}.user-info-modal-backdrop .user-info-modal .modal-content .action-buttons .follow-button.following{background-color:transparent;color:#1d9bf0;border-color:#1d9bf0}.user-info-modal-backdrop .user-info-modal .modal-content .action-buttons .follow-button.following:hover{background-color:#fee;color:#e0245e;border-color:#e0245e}.user-info-modal-backdrop .user-info-modal .modal-content .action-buttons .report-button{background-color:transparent;color:#e0245e;border-color:#e0245e}.user-info-modal-backdrop .user-info-modal .modal-content .action-buttons .report-button:hover{background-color:#fee}.user-info-modal-backdrop .user-info-modal .modal-content .action-buttons .own-profile-info{text-align:center;padding:16px;background-color:#f0f8ff;border-radius:12px;border:2px solid #e1f0ff}.user-info-modal-backdrop .user-info-modal .modal-content .action-buttons .own-profile-info .info-text{margin:0;color:#1d9bf0;font-size:15px;font-weight:500}.user-info-modal-backdrop .user-info-modal .modal-content .blog-link-area{position:absolute;top:25px;right:25px}.user-info-modal-backdrop .user-info-modal .modal-content .blog-link-area img{width:40px;height:40px}.user-info-modal-backdrop .user-info-modal .modal-content .blog-link-area p{display:none}.user-info-modal-backdrop .user-info-modal .modal-content .blog-link-area:hover p{position:absolute;top:0;left:0;display:flex;width:40px;height:40px;color:#fff;font-size:11px;text-align:center;border-radius:50%;align-items:center;background-color:#121212;opacity:.6}.report-modal-backdrop{position:fixed;inset:0;background-color:#000c;display:flex;justify-content:center;align-items:center;z-index:1000000;animation:modal-fade-in .2s ease-out}.report-modal-backdrop .report-modal{background:#fefefe;border-radius:16px;width:90%;max-width:500px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px #0006;animation:modal-slide-up .3s ease-out}.report-modal-backdrop .report-modal .modal-header{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-bottom:1px solid #e1e8ed;background-color:#dbdce0}.report-modal-backdrop .report-modal .modal-header h3{margin:0;font-size:20px;font-weight:700;color:#14171a}.report-modal-backdrop .report-modal .modal-header .close-button{cursor:pointer;width:30px;height:30px;display:flex;align-items:center;justify-content:center;text-align:center;text-indent:-9999px;overflow:hidden}.report-modal-backdrop .report-modal .modal-header .close-button:after{content:"";display:inline-block;width:15px;height:15px;background-color:red;border-radius:50%;text-indent:0;transition:all .3s ease}.report-modal-backdrop .report-modal .modal-header .close-button:hover:after{content:"x";color:#fff;font-size:15px;line-height:13px;background-color:#cd0000}.report-modal-backdrop .report-modal .modal-content{padding:24px}.report-modal-backdrop .report-modal .modal-content .report-target{margin-bottom:20px;padding:12px;background-color:#fff3cd;border:1px solid #ffeaa7;border-radius:8px;color:#856404;font-size:14px}.report-modal-backdrop .report-modal .modal-content .form-group{margin-bottom:20px}.report-modal-backdrop .report-modal .modal-content .form-group label{display:block;margin-bottom:8px;font-weight:600;color:#14171a;font-size:15px}.report-modal-backdrop .report-modal .modal-content .form-group select{width:100%;padding:12px;border:2px solid #e1e8ed;border-radius:8px;font-size:15px;background-color:#fff;transition:border-color .2s ease}.report-modal-backdrop .report-modal .modal-content .form-group select:focus{outline:none;border-color:#1d9bf0}.report-modal-backdrop .report-modal .modal-content .form-group textarea{width:100%;padding:12px;border:2px solid #e1e8ed;border-radius:8px;font-size:15px;resize:vertical;min-height:80px;font-family:inherit;transition:border-color .2s ease}.report-modal-backdrop .report-modal .modal-content .form-group textarea:focus{outline:none;border-color:#1d9bf0}.report-modal-backdrop .report-modal .modal-content .form-group textarea::placeholder{color:#657786}.report-modal-backdrop .report-modal .modal-content .report-buttons{display:flex;gap:12px;justify-content:flex-end}.report-modal-backdrop .report-modal .modal-content .report-buttons button{padding:12px 24px;border-radius:24px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s ease;border:1px solid;min-width:100px}.report-modal-backdrop .report-modal .modal-content .report-buttons .cancel-button{background-color:transparent;color:#657786;border-color:#e1e8ed}.report-modal-backdrop .report-modal .modal-content .report-buttons .cancel-button:hover{background-color:#f7f9fa;color:#14171a}.report-modal-backdrop .report-modal .modal-content .report-buttons .submit-button{background-color:#e0245e;color:#fff;border-color:#e0245e}.report-modal-backdrop .report-modal .modal-content .report-buttons .submit-button:hover{background-color:#c91e4a;border-color:#c91e4a}@media(max-width:768px){.user-info-modal-backdrop .user-info-modal{width:95%;margin:20px}.user-info-modal-backdrop .user-info-modal .modal-content{padding:20px}.user-info-modal-backdrop .user-info-modal .modal-content .user-profile-section{flex-direction:column;align-items:center;text-align:center}.user-info-modal-backdrop .user-info-modal .modal-content .user-profile-section .profile-image img{width:100px;height:100px}.user-info-modal-backdrop .user-info-modal .modal-content .action-buttons{flex-direction:column}.report-modal-backdrop .report-modal{width:95%;margin:20px}.report-modal-backdrop .report-modal .modal-content{padding:20px}.report-modal-backdrop .report-modal .modal-content .report-buttons{flex-direction:column}.report-modal-backdrop .report-modal .modal-content .report-buttons button{width:100%}}.change-pw-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100vh;background:#00000073;display:flex;justify-content:center;align-items:center;z-index:10000}.change-pw-modal{background:#fff;width:100%;max-width:420px;border-radius:10px;box-shadow:0 8px 24px #02061733;overflow:hidden;animation:fadeIn .3s ease-out}.change-pw-modal .modal-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 1.5rem .5rem;border-bottom:none}.change-pw-modal .modal-header h2{font-size:1.25rem;font-weight:700;margin:0;color:#333;flex:1;text-align:center}.change-pw-modal .modal-header .close-btn{background:none;border:none;font-size:1.5rem;cursor:pointer;color:#999;position:absolute;top:10px;right:15px}.change-pw-modal .modal-header .close-btn:hover{color:#333}.change-pw-modal .modal-body{padding:1.5rem}.change-pw-modal .modal-body .form-group{margin-bottom:16px}.change-pw-modal .modal-body .form-group label{display:block;margin-bottom:6px;font-size:.9rem;font-weight:500;color:#666}.change-pw-modal .modal-body .form-group input{width:100%;padding:10px;border:1px solid #ddd;border-radius:6px;font-size:1rem;transition:border-color .2s}.change-pw-modal .modal-body .form-group input:focus{outline:none;border-color:#0b69ff}.change-pw-modal .modal-body .rule-hint{font-size:.8rem;color:#666;margin-top:4px}.change-pw-modal .modal-body .error-text{font-size:.8rem;color:#ef4444;margin-top:4px}.change-pw-modal .modal-body .error-msg{color:#ef4444;font-size:.85rem;margin-bottom:15px;text-align:center}.change-pw-modal .modal-body .modal-footer{display:flex;justify-content:flex-end;gap:10px;margin-top:10px}.change-pw-modal .modal-body .modal-footer button{padding:8px 16px;border-radius:6px;font-size:.95rem;cursor:pointer;border:none;transition:opacity .2s}.change-pw-modal .modal-body .modal-footer button:hover{opacity:.9}.change-pw-modal .modal-body .modal-footer button.cancel-btn{background:#f3f4f6;color:#4b5563}.change-pw-modal .modal-body .modal-footer button.submit-btn{background:#0b69ff;color:#fff;border-radius:8px;padding:.625rem .75rem}.change-pw-modal .modal-body .modal-footer button.submit-btn:disabled{background:#9ca3af;cursor:not-allowed}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.find-account-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100vh;background:#00000073;display:flex;justify-content:center;align-items:center;z-index:10000}.find-account-modal{background:#fff;width:100%;max-width:420px;border-radius:10px;box-shadow:0 8px 24px #02061733;position:relative;overflow:hidden;animation:fadeIn .3s ease-out}.find-account-modal .close-btn{position:absolute;right:.5rem;top:.5rem;background:transparent;border:none;font-size:1.25rem;line-height:1;cursor:pointer;color:#000;z-index:10}.find-account-modal .close-btn:hover{color:#666}.find-account-modal .tabs{display:flex;border-bottom:2px solid #eee;margin-top:1.5rem}.find-account-modal .tabs button{flex:1;padding:15px;background:none;border:none;font-size:1rem;font-weight:500;color:#888;cursor:pointer;transition:all .2s}.find-account-modal .tabs button.active{color:#0b69ff;border-bottom:2px solid #0b69ff;font-weight:600}.find-account-modal .tabs button:hover:not(.active){background:#f9f9f9}.find-account-modal .tab-content{padding:1.5rem}.find-account-modal .tab-content .form-group{margin-bottom:16px}.find-account-modal .tab-content .form-group label{display:block;font-size:.9rem;color:#333;margin-bottom:5px}.find-account-modal .tab-content .form-group input{width:100%;padding:.5rem;border:1px solid #ddd;border-radius:6px;font-size:.95rem;margin-top:.375rem}.find-account-modal .tab-content .form-group input:focus{outline:none;border-color:#0b69ff}.find-account-modal .tab-content .submit-btn{width:100%;padding:.625rem .75rem;background:#0b69ff;color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;margin-top:.25rem}.find-account-modal .tab-content .submit-btn:disabled{background:#ccc;cursor:not-allowed}.find-account-modal .tab-content .error-msg{color:#e74c3c;font-size:.85rem;text-align:center;background-color:#fdf2f2;padding:8px;border-radius:6px;margin-top:4px;margin-bottom:10px}.find-account-modal .tab-content .result-view{text-align:center}.find-account-modal .tab-content .result-view h3{font-size:1.1rem;margin:5px 0}.find-account-modal .tab-content .result-view .found-id{font-size:1.5rem;color:#0b69ff;font-weight:700;margin:15px 0}.find-account-modal .tab-content .result-view .login-btn{width:100%;padding:.625rem .75rem;background:#10b981;color:#fff;border:none;border-radius:8px;margin-top:15px;cursor:pointer;font-size:1rem;font-weight:600}.find-account-modal .tab-content .info-msg{text-align:center;background:#f0f9ff;color:#0369a1;padding:10px;border-radius:6px;margin-bottom:15px;font-size:.9rem;line-height:1.4}#Header{width:100%;height:100px;background-color:#f0f0f0}#Header .container{display:flex;align-items:center;justify-content:space-between;width:100%;height:100%;padding:0 20px}#Header .container .left{display:flex;align-items:center;justify-content:start;padding:10px}#Header .container .left .logo-wrapper a{display:flex;align-items:center;justify-content:start;gap:10px;transition:all .3s ease-in-out}#Header .container .left .logo-wrapper a .logo{width:100px;height:100px;background-image:url(/img/logBook_logo.png);background-size:contain;background-repeat:no-repeat;background-position:center}#Header .container .left .logo-wrapper a .title{width:200px;height:100px;background-image:url(/img/logBook_logo_text.png);background-size:contain;background-repeat:no-repeat;background-position:center}#Header .container .left .logo-wrapper a:hover{animation:header-logo-animation 3s ease-in-out infinite}#Header .container .left .logo-wrapper a:hover .logo{animation:header-logo-animation-2 3s ease-in-out infinite}#Header .container .left .intro-wrapper{width:150px;height:50px;border-radius:50px;border:4px solid #a3a3a3;overflow:hidden;background-color:#121212;transition:all .3s ease}#Header .container .left .intro-wrapper a{position:relative;display:block;width:100%;height:100%;line-height:42px;background:linear-gradient(45deg,#ff6b6b,#4ecdc4,#45b7d1,#96ceb4,#feca57);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradient-shift 3s ease-in-out infinite;text-align:center;cursor:pointer;transition:all .3s ease}#Header .container .left .intro-wrapper a:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}#Header .container .left .intro-wrapper a:hover:before{left:100%}#Header .container .left .intro-wrapper a p{font-size:20px;font-weight:600}#Header .container .left .intro-wrapper:hover{transform:translateY(-3px)}#Header .container .left .role-toggle{display:flex;align-items:center;gap:4px;margin-left:12px;padding:6px 10px;border-radius:8px;border:2px solid #a3a3a3;background-color:#1a1a1a}#Header .container .left .role-toggle button{padding:6px 12px;font-size:13px;font-weight:600;border:none;border-radius:6px;background:transparent;color:#888;cursor:pointer;transition:all .2s ease}#Header .container .left .role-toggle button:hover{color:#ccc;background:#ffffff0f}#Header .container .left .role-toggle button.active{color:#4ecdc4;background:#4ecdc426}#Header .container .left .role-toggle .role-divider{color:#555;font-weight:600;-webkit-user-select:none;user-select:none}#Header .container .left .admin-page-btn{margin-left:12px;padding:8px 16px;font-size:14px;font-weight:600;border-radius:8px;border:2px solid #4ecdc4;background:#0000009b;color:#4ecdc4;text-decoration:none;transition:all .2s ease}#Header .container .left .admin-page-btn:hover{background:#4ecdc440;transform:translateY(-1px)}#Header .container .left .admin-page-btn p{margin:0;width:100%}#Header .container .right{display:flex;align-items:center;justify-content:end;position:relative;gap:10px;height:100%;padding:0 20px}#Header .container .right .search-area{display:flex;align-items:center;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:6px;box-shadow:0 8px 24px #0000000f;padding:6px 8px;margin-right:8px;z-index:1200;width:auto;overflow:hidden;opacity:0;visibility:hidden;transform-origin:right center;transform:scaleX(0);min-width:44px;pointer-events:none;transition:transform .22s ease,opacity .18s ease,visibility .18s}#Header .container .right .search-area form{display:flex;align-items:center;width:100%}#Header .container .right .search-area .search-input{width:100%;display:flex;align-items:center;gap:8px;background:linear-gradient(180deg,#fff,#fbfbfb);border-radius:8px;padding:6px 8px;box-shadow:0 4px 10px #1414140a;position:relative}#Header .container .right .search-area .input-icon{display:inline-flex;flex:0 0 28px;align-items:center;justify-content:center;color:#6b6b6b;z-index:2}#Header .container .right .search-area input{flex:1 1 auto;width:100%;min-width:120px;height:42px;padding:6px 8px;border:none;background:transparent;font-size:14px;color:#111;outline:none}#Header .container .right .search-area .clear-btn{all:unset;cursor:pointer;color:#888;font-size:18px;line-height:1;padding:2px 6px;border-radius:6px}#Header .container .right .search-area .clear-btn:hover{background:#0000000a;color:#444}#Header .container .right .search-area.open{width:40vw;opacity:1;visibility:visible;transform:scaleX(1);pointer-events:auto;overflow:visible}#Header .container .right .search-wrapper{display:flex;align-items:center}#Header .container .right .search-btn{position:relative;width:40px;height:40px;border-radius:50%;background-color:#fff;display:flex;align-items:center;justify-content:center;transition:all .3s ease}#Header .container .right .search-btn svg{width:20px}#Header .container .right .search-btn:hover{background-color:#c0dedd}#Header .container .right .search-btn .search-toggle{all:unset;width:100%;height:100%;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}#Header .container .right .search-btn.active{background:linear-gradient(180deg,#f6f9f8,#e7f2ef);box-shadow:0 6px 16px #14281e14;transform:translateY(-1px)}#Header .container .right .search-btn .search-toggle svg{color:#1f6f63}#Header .container .right .notification-btn-wrap{position:relative}#Header .container .right .notification-btn{position:relative;width:40px;height:40px;border-radius:50%;background-color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease}#Header .container .right .notification-btn svg{width:20px}#Header .container .right .notification-btn:hover{background-color:#c0dedd}#Header .container .right .notification-badge{position:absolute;top:2px;right:2px;min-width:18px;height:18px;padding:0 4px;font-size:11px;font-weight:600;color:#fff;background:#e53935;border-radius:9px;display:flex;align-items:center;justify-content:center}#Header .container .right .login-btn .login-btn-wrap button{position:relative;width:100px;height:40px;padding:10px 20px;border-radius:10px;background-color:#fff;color:#000;font-size:14px;font-weight:600;overflow:hidden;cursor:pointer;transition:all .3s ease}#Header .container .right .login-btn .login-btn-wrap button:hover{background-color:#000;color:#fff}#Header .container .right .login-btn .login-btn-wrap button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(135,135,135,.6),transparent);transition:left .5s}#Header .container .right .login-btn .login-btn-wrap button:hover:before{left:100%}#Header .container .right .login-btn .user-area{display:flex;align-items:center;gap:10px;position:relative}#Header .container .right .login-btn .user-area .user-profile{width:100%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;background:transparent;border:none}#Header .container .right .login-btn .user-area .user-profile img{width:40px;height:40px;border-radius:50%;object-fit:cover;display:block;border:2px solid #e0e0e0;transition:all .2s ease}#Header .container .right .login-btn .user-area .user-profile img:hover{transform:scale(1.1);border-color:#1d9bf0;box-shadow:0 4px 12px #00000026}#Header .container .right .login-btn .user-area .user-profile .user-name{font-size:14px;font-weight:600;color:#222;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:8px 16px;border-radius:20px;border:2px solid rgba(0,0,0,.06);transition:all .2s ease}#Header .container .right .login-btn .user-area .user-profile .user-name.no-profile-image,#Header .container .right .login-btn .user-area .user-profile .user-name.fallback-user-name{background-color:#1d9bf0;color:#fff;border-color:#1d9bf0;font-weight:700;text-transform:uppercase;letter-spacing:.5px;min-width:60px;text-align:center}#Header .container .right .login-btn .user-area .user-profile:hover .user-name.no-profile-image,#Header .container .right .login-btn .user-area .user-profile:hover .user-name.fallback-user-name{background-color:#1a8cd8;transform:translateY(-1px);box-shadow:0 4px 12px #1d9bf04d}#Header .container .right .login-btn .user-area .user-profile:active{transform:translateY(0)}#Header .container .right .login-btn .user-area .user-menu{position:absolute;top:calc(100% + 8px);right:0;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:6px;box-shadow:0 8px 20px #0000001f;padding:6px 0;min-width:160px;z-index:1000}#Header .container .right .login-btn .user-area .user-menu li a,#Header .container .right .login-btn .user-area .user-menu li button,#Header .container .right .login-btn .user-area .user-menu li .link{display:block;width:100%;padding:8px 14px;color:#222;font-size:14px;font-weight:600;text-decoration:none;background:transparent;text-align:left;border:none;cursor:pointer}#Header .container .right .login-btn .user-area .user-menu li a:hover,#Header .container .right .login-btn .user-area .user-menu li button:hover,#Header .container .right .login-btn .user-area .user-menu li .link:hover{background:#f5f5f5}#Header.dark-mode{background-color:#1a1a1a;border-bottom:1px solid #333}#Header.dark-mode .container .left .logo-wrapper a .title{filter:invert(1) brightness(2)}#Header.dark-mode .container .right .search-area{background:#2a2a2a;border-color:#444}#Header.dark-mode .container .right .search-area .search-input{background:linear-gradient(180deg,#2a2a2a,#222);box-shadow:0 4px 10px #0000004d}#Header.dark-mode .container .right .search-area .input-icon{color:#aaa}#Header.dark-mode .container .right .search-area input{color:#fff}#Header.dark-mode .container .right .search-area input::placeholder{color:#888}#Header.dark-mode .container .right .search-area .clear-btn{color:#aaa}#Header.dark-mode .container .right .search-area .clear-btn:hover{color:#fff}#Header.dark-mode .container .right .search-area form{width:100%}#Header.dark-mode .container .right .search-btn .search-toggle{color:#aaa}#Header.dark-mode .container .right .search-btn .search-toggle:hover{color:#fff}#Header.dark-mode .container .right .notification-btn{color:#aaa}#Header.dark-mode .container .right .notification-btn:hover{color:#fff}#Header.dark-mode .container .right .user-area .user-profile img{border-color:#555}#Header.dark-mode .container .right .user-area .user-profile img:hover{border-color:#1d9bf0}#Header.dark-mode .container .right .user-area .user-profile .user-name{color:#ddd;border-color:#555}#Header.dark-mode .container .right .user-area .user-profile .user-name.no-profile-image,#Header.dark-mode .container .right .user-area .user-profile .user-name.fallback-user-name{background-color:#1d9bf0;color:#fff;border-color:#1d9bf0}#Header.dark-mode .container .right .user-area .user-profile:hover .user-name.no-profile-image,#Header.dark-mode .container .right .user-area .user-profile:hover .user-name.fallback-user-name{background-color:#1a8cd8}#Header.dark-mode .container .right .user-area .user-menu{background:#2a2a2a;border-color:#444;box-shadow:0 8px 20px #0006}#Header.dark-mode .container .right .user-area .user-menu li a,#Header.dark-mode .container .right .user-area .user-menu li button,#Header.dark-mode .container .right .user-area .user-menu li .link{color:#ddd}#Header.dark-mode .container .right .user-area .user-menu li a:hover,#Header.dark-mode .container .right .user-area .user-menu li button:hover,#Header.dark-mode .container .right .user-area .user-menu li .link:hover{background:#3a3a3a}.smart-search-dropdown{position:absolute;top:100%;left:0;width:100%;background:#fff;border:1px solid #e0e0e0;border-radius:0 0 12px 12px;box-shadow:0 8px 16px #0000001a;z-index:1000;padding:16px;max-height:500px;overflow-y:auto;animation:slideDown .2s ease-out}@media(max-width:768px){.smart-search-dropdown{border-radius:0;position:fixed;top:60px;height:calc(100vh - 60px);border:none}}.smart-search-dropdown.loading,.smart-search-dropdown.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px;color:#888;font-size:.9rem}.smart-search-dropdown .spinner{width:20px;height:20px;border:2px solid #ddd;border-top-color:#1d9bf0;border-radius:50%;animation:spin .8s linear infinite;margin-bottom:8px}.smart-search-dropdown .ai-badge{font-size:.7rem;color:#fff;background:linear-gradient(90deg,#1d9bf0,#83f);padding:4px 10px;border-radius:20px;display:inline-block;margin-bottom:16px;font-weight:600;box-shadow:0 4px 8px #1d9bf033}.smart-search-dropdown .section{margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid #f0f0f0}.smart-search-dropdown .section:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none}.smart-search-dropdown .section .section-title{font-size:.75rem;color:#536471;font-weight:700;margin-bottom:12px;text-transform:uppercase;letter-spacing:.05em}.smart-search-dropdown .tags-wrapper,.smart-search-dropdown .topics-wrapper{display:flex;flex-wrap:wrap;gap:8px}.smart-search-dropdown .tags-wrapper .tag-chip,.smart-search-dropdown .tags-wrapper .topic-chip,.smart-search-dropdown .topics-wrapper .tag-chip,.smart-search-dropdown .topics-wrapper .topic-chip{padding:6px 14px;background:#f0f8ff;border:1px solid #e1effe;border-radius:20px;font-size:.85rem;color:#1d9bf0;transition:all .2s cubic-bezier(.4,0,.2,1);text-decoration:none;font-weight:500}.smart-search-dropdown .tags-wrapper .tag-chip:hover,.smart-search-dropdown .tags-wrapper .topic-chip:hover,.smart-search-dropdown .topics-wrapper .tag-chip:hover,.smart-search-dropdown .topics-wrapper .topic-chip:hover{background:#1d9bf0;color:#fff;border-color:#1d9bf0;transform:translateY(-2px);box-shadow:0 4px 12px #1d9bf04d}.smart-search-dropdown .tags-wrapper .topic-chip,.smart-search-dropdown .topics-wrapper .topic-chip{background:#f3f4f6;border-color:#e5e7eb;color:#4b5563}.smart-search-dropdown .tags-wrapper .topic-chip:hover,.smart-search-dropdown .topics-wrapper .topic-chip:hover{background:#4b5563;color:#fff;border-color:#4b5563}.smart-search-dropdown .posts-wrapper{display:flex;flex-direction:column;gap:12px}.smart-search-dropdown .posts-wrapper .post-item{display:flex;gap:16px;padding:12px;border-radius:12px;text-decoration:none;color:inherit;transition:all .2s;border:1px solid transparent}.smart-search-dropdown .posts-wrapper .post-item:hover{background:#f8fafc;border-color:#f1f5f9;transform:translate(4px)}.smart-search-dropdown .posts-wrapper .post-item.recommended{background:#fffbeb;border:1px solid #fef3c7}.smart-search-dropdown .posts-wrapper .post-item.recommended:hover{background:#fef3c7;border-color:#fde68a}.smart-search-dropdown .posts-wrapper .post-item.recommended .post-title{color:#92400e}.smart-search-dropdown .posts-wrapper .post-item .post-thumb{width:72px;height:72px;flex-shrink:0}.smart-search-dropdown .posts-wrapper .post-item .post-thumb img{width:100%;height:100%;object-fit:cover;border-radius:8px;box-shadow:0 2px 4px #0000000d}.smart-search-dropdown .posts-wrapper .post-item .post-info{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center}.smart-search-dropdown .posts-wrapper .post-item .post-info .post-title{font-weight:700;font-size:1rem;margin-bottom:6px;color:#0f1419;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.smart-search-dropdown .posts-wrapper .post-item .post-info .post-preview{font-size:.85rem;color:#536471;line-height:1.4;margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.smart-search-dropdown .posts-wrapper .post-item .post-info .post-mini-tags{display:flex;gap:6px;flex-wrap:wrap}.smart-search-dropdown .posts-wrapper .post-item .post-info .post-mini-tags span{font-size:.7rem;color:#536471;background:#f1f5f9;padding:3px 8px;border-radius:4px;font-weight:500}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}.notification-panel{position:absolute;top:calc(100% + 8px);right:0;width:360px;max-height:420px;background:#fff;border-radius:12px;box-shadow:0 8px 24px #0000001f;overflow:hidden;z-index:1000}.notification-panel__header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid #eee}.notification-panel__header h3{margin:0;font-size:16px;font-weight:600}.notification-panel__read-all{font-size:12px;color:#1f6f63;background:none;border:none;cursor:pointer;padding:4px 8px}.notification-panel__read-all:hover{text-decoration:underline}.notification-panel__list{max-height:360px;overflow-y:auto}.notification-panel__empty{padding:32px 16px;text-align:center;color:#888;font-size:14px}.notification-panel__item{display:flex;align-items:flex-start;gap:12px;width:100%;padding:12px 16px;border:none;background:transparent;cursor:pointer;text-align:left;transition:background .2s}.notification-panel__item:hover{background:#f5f5f5}.notification-panel__item.unread{background:#e3f2fd;border-left:3px solid #03a9f4}.notification-panel__icon{font-size:20px;flex-shrink:0}.notification-panel__content{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.notification-panel__title{font-size:14px;font-weight:600;color:#333}.notification-panel__message{font-size:13px;color:#666;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.notification-panel__time{font-size:11px;color:#999;margin-top:2px}#Footer{width:100%;background-color:#ccc}#Footer .container{width:1200px;margin:0 auto;padding:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}#Footer .container .top{width:100%;display:flex;align-items:center;justify-content:space-between}#Footer .container .top .icons{display:flex;align-items:center;justify-content:start;gap:20px;transition:all .3s ease-in-out}#Footer .container .top .icons .logo{width:100px;height:100px;background-image:url(/img/logBook_logo.png);background-size:contain;background-repeat:no-repeat;background-position:center}#Footer .container .top .icons .title{width:200px;height:100px;background-image:url(/img/logBook_logo_text.png);background-size:contain;background-repeat:no-repeat;background-position:center}#Footer .container .top .icons:hover{animation:header-logo-animation 3s ease infinite}#Footer .container .top .icons:hover .logo{animation:header-logo-animation-2 4s ease infinite}#Footer .container .top .terms{display:flex;align-items:center;justify-content:end;gap:50px;width:100%}#Footer .container .top .terms .left{font-size:12px;color:#666;font-weight:600}#Footer .container .top .terms .right{font-size:12px;color:#666}#Footer .container .top .terms .right a{color:#666}#Footer .container .top .terms .right a:hover{color:#fff}#Footer .container .top .terms .right .skull{display:flex;align-items:center;justify-content:center;gap:10px;font-size:30px;color:#666}#Footer .container .top .terms .right .skull:hover{animation:header-logo-animation 4s ease infinite}#Footer .container .top .terms .right .skull:hover p{animation:header-logo-animation-2 2.5s ease infinite}#Footer .middle{width:100%;padding:30px 0;border-top:1px solid rgba(0,0,0,.1);border-bottom:1px solid rgba(0,0,0,.1)}#Footer .middle .footer-sections{display:grid;grid-template-columns:repeat(4,1fr);gap:40px;max-width:1000px;margin:0 auto}#Footer .middle .footer-sections .section h4{font-size:16px;font-weight:700;color:#333;margin-bottom:15px;text-transform:uppercase;letter-spacing:1px}#Footer .middle .footer-sections .section ul{list-style:none;padding:0;margin:0}#Footer .middle .footer-sections .section ul li{margin-bottom:8px}#Footer .middle .footer-sections .section ul li a{color:#666;text-decoration:none;font-size:14px;transition:all .3s ease}#Footer .middle .footer-sections .section ul li a:hover{color:#000;padding-left:5px}#Footer .bottom{width:100%;display:flex;justify-content:space-between;align-items:center;padding:20px 0 0}#Footer .bottom .contact-info{display:flex;gap:30px;font-size:12px;color:#666}#Footer .bottom .contact-info p{margin:0;display:flex;align-items:center;gap:5px}#Footer .bottom .tech-stack{font-size:12px;color:#999;font-style:italic}#Footer .bottom .tech-stack p{margin:0}#Footer.dark-mode{background-color:#1a1a1a;border-top:1px solid #333}#Footer.dark-mode .container .top .icons .title{filter:invert(1) brightness(2)}#Footer.dark-mode .container .top .terms .left,#Footer.dark-mode .container .top .terms .right,#Footer.dark-mode .container .top .terms .right a{color:#aaa}#Footer.dark-mode .container .top .terms .right a:hover{color:#fff}#Footer.dark-mode .container .top .terms .right .skull{color:#aaa}#Footer.dark-mode .container .middle{border-top:1px solid #333;border-bottom:1px solid #333}#Footer.dark-mode .container .middle .footer-sections .section h4{color:#fff}#Footer.dark-mode .container .middle .footer-sections .section ul li a{color:#aaa}#Footer.dark-mode .container .middle .footer-sections .section ul li a:hover{color:#fff}#Footer.dark-mode .container .bottom .contact-info,#Footer.dark-mode .container .bottom .contact-info p{color:#aaa}#Footer.dark-mode .container .bottom .tech-stack,#Footer.dark-mode .container .bottom .tech-stack p{color:#666}@media(max-width:768px){#Footer .container{padding:15px}#Footer .container .top{flex-direction:column;gap:20px;text-align:center}#Footer .container .top .terms{flex-direction:column;gap:15px;align-items:center}#Footer .container .top .terms .right{flex-direction:column;gap:15px}#Footer .container .middle .footer-sections{grid-template-columns:repeat(2,1fr);gap:30px}#Footer .container .bottom{flex-direction:column;gap:15px;text-align:center}#Footer .container .bottom .contact-info{flex-direction:column;gap:10px}}@media(max-width:480px){#Footer .container .middle .footer-sections{grid-template-columns:1fr;gap:20px}}#FloatingButton{position:fixed;right:2%;bottom:5%;z-index:1200;display:flex;align-items:center;justify-content:center}#FloatingButton .fab-toggle{width:56px;height:56px;border-radius:50%;background:#6c5ce7;color:#fff;border:none;box-shadow:0 6px 18px #0000002e;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .18s ease,background .18s ease}#FloatingButton .fab-toggle .toggle-icon{display:inline-block;transition:transform 1s cubic-bezier(.2,.9,.3,1);transform-origin:center}#FloatingButton .fab-toggle .toggle-icon.open{transform:rotate(-45deg)}#FloatingButton .fab-toggle:active{transform:scale(.96)}#FloatingButton .fab-toggle:hover{transform:scale(1.1)}#FloatingButton .fab-actions{position:absolute;right:2%;bottom:0;width:0;height:0;pointer-events:none}#FloatingButton .fab-action{position:absolute;right:0;bottom:0;width:44px;height:44px;border-radius:50%;background:#fff;color:#333;border:none;box-shadow:0 4px 12px #0000001f;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transform:translate(0) scale(.6);transition:all .2s ease}#FloatingButton .fab-action img{width:18px;height:18px}#FloatingButton .fab-action svg{transition:transform .2s ease}#FloatingButton .fab-action:hover:not(.disabled){transform:scale(1.06);background-color:#6c5ce7}#FloatingButton .fab-action:hover:not(.disabled) svg{transform:scale(1.2);filter:invert(1) brightness(2)}#FloatingButton .fab-action:hover:not(.disabled) img{transform:scale(1.2);filter:invert(1) brightness(2)}#FloatingButton .fab-action.disabled{background:#e9ecef;color:#6c757d;cursor:not-allowed;opacity:.6}#FloatingButton .fab-action.disabled svg{filter:grayscale(1)}#FloatingButton .fab-action.disabled img{filter:grayscale(1)}#FloatingButton.open .fab-actions{pointer-events:auto}@media(max-width:480px){#FloatingButton{right:16px;bottom:16px}#FloatingButton .fab-toggle{width:48px;height:48px}#FloatingButton .fab-action{width:40px;height:40px}}#FeedPage{padding:48px 24px;position:relative}#FeedPage .feed-filter-tabs{display:flex;gap:4px;margin:0 auto 24px;padding:6px;background:#fffffff2;border-radius:12px;width:fit-content;box-shadow:0 2px 8px #0000000a;border:1px solid #eee}#FeedPage .filter-tab{border:none;background:transparent;padding:10px 24px;font-size:14px;font-weight:500;color:#666;border-radius:8px;cursor:pointer;transition:all .15s ease}#FeedPage .filter-tab:hover{background:#0078d40f;color:#0078d4}#FeedPage .filter-tab.active{background:#0078d4;color:#fff;box-shadow:0 2px 8px #0078d440}#FeedPage .container{margin:0 auto;position:relative;max-width:1200px}#FeedPage .ai-search-info{margin:0 auto 24px;max-width:1200px;padding:0 16px;display:flex;flex-direction:column;gap:12px}#FeedPage .ai-search-info .ai-mode-badge{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(135deg,#f0f7ff,#e6f0ff);color:#0078d4;padding:6px 14px;border-radius:999px;font-size:13px;font-weight:600;width:fit-content;border:1px solid rgba(0,120,212,.1);box-shadow:0 2px 8px #0078d40d}#FeedPage .ai-search-info .ai-mode-badge .sparkle-icon{font-size:14px}#FeedPage .ai-search-info .recommended-tags{display:flex;flex-wrap:wrap;gap:8px}#FeedPage .ai-search-info .recommended-tags .tag-chip{background:#fff;border:1px solid #eee;padding:6px 16px;border-radius:8px;font-size:13px;color:#444;cursor:pointer;transition:all .15s ease;box-shadow:0 2px 6px #00000008}#FeedPage .ai-search-info .recommended-tags .tag-chip:hover{border-color:#0078d4;color:#0078d4;transform:translateY(-2px);box-shadow:0 4px 12px #0078d41a}#FeedPage .ai-search-info .recommended-tags .tag-chip:active{transform:translateY(0)}#FeedPage .columns-wrapper{position:absolute;top:5px;right:24px;z-index:950}#FeedPage .columns-wrapper .columns-controls{display:flex;gap:8px;align-items:center;background:#fffffff2;padding:6px;border-radius:999px;box-shadow:0 6px 18px #0a0a0a0f;border:1px solid #ececec}#FeedPage .columns-wrapper .col-btn{border:none;background:transparent;padding:6px;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;cursor:pointer;transition:background .15s ease,transform .12s ease,box-shadow .15s ease}#FeedPage .columns-wrapper .col-btn img{width:18px;height:18px;display:block;filter:grayscale(80%) contrast(90%);opacity:.95}#FeedPage .columns-wrapper .col-btn:hover{background:#0000000a;transform:translateY(-2px)}#FeedPage .columns-wrapper .col-btn.active{background:#0078d4;box-shadow:0 6px 18px #0078d42e}#FeedPage .columns-wrapper .col-btn.active img{filter:none;opacity:1}#FeedPage .columns-wrapper .col-btn:focus{outline:2px solid rgba(0,120,212,.18);outline-offset:2px}@media(max-width:560px){#FeedPage .columns-wrapper{top:12px;right:12px}#FeedPage .columns-wrapper .col-btn{width:32px;height:32px}#FeedPage .columns-wrapper .col-btn img{width:16px;height:16px}}#FeedPage .layout{display:block;position:relative}#FeedPage .layout .react-grid-item{cursor:pointer;transition:all .2s ease;background-color:transparent;transition-property:left,top,width,height;border-radius:10px}#FeedPage .layout .react-grid-item.cssTransforms{transition-property:transform,width,height}#FeedPage .layout .react-grid-item.resizing{transition:none;z-index:1;will-change:width,height}#FeedPage .layout .react-grid-item.react-draggable-dragging{transition:none;z-index:3;will-change:transform}#FeedPage .layout .react-grid-item>.react-resizable-handle{position:absolute;width:20px;height:20px}#FeedPage .layout .react-grid-item>.react-resizable-handle:after{content:"";position:absolute;right:6px;bottom:6px;width:5px;height:5px;border-right:2px solid rgba(0,0,0,.4);border-bottom:2px solid rgba(0,0,0,.4)}#FeedPage .layout .react-grid-item>.react-resizable-handle.react-resizable-handle-sw{bottom:0;left:0;cursor:sw-resize;transform:rotate(90deg)}#FeedPage .layout .react-grid-item>.react-resizable-handle.react-resizable-handle-se{bottom:0;right:0;cursor:se-resize}#FeedPage .layout .react-grid-item>.react-resizable-handle.react-resizable-handle-nw{top:0;left:0;cursor:nw-resize;transform:rotate(180deg)}#FeedPage .layout .react-grid-item>.react-resizable-handle.react-resizable-handle-ne{top:0;right:0;cursor:ne-resize;transform:rotate(270deg)}#FeedPage .layout .react-grid-item>.react-resizable-handle.react-resizable-handle-w,#FeedPage .layout .react-grid-item>.react-resizable-handle.react-resizable-handle-e{top:50%;margin-top:-10px;cursor:ew-resize}#FeedPage .layout .react-grid-item>.react-resizable-handle.react-resizable-handle-w{left:0;transform:rotate(135deg)}#FeedPage .layout .react-grid-item>.react-resizable-handle.react-resizable-handle-e{right:0;transform:rotate(315deg)}#FeedPage .layout .react-grid-item>.react-resizable-handle.react-resizable-handle-n,#FeedPage .layout .react-grid-item>.react-resizable-handle.react-resizable-handle-s{left:50%;margin-left:-10px;cursor:ns-resize}#FeedPage .layout .react-grid-item>.react-resizable-handle.react-resizable-handle-n{top:0;transform:rotate(225deg)}#FeedPage .layout .react-grid-item>.react-resizable-handle.react-resizable-handle-s{bottom:0;transform:rotate(45deg)}#FeedPage .post-card>.react-resizable-handle{display:none!important}#FeedPage .post-card{background:#fff;border:1px solid #ddd;border-radius:12px;box-shadow:0 6px 18px #0a0a0a0f;overflow:hidden;display:flex;flex-direction:column;transition:transform .18s ease,box-shadow .18s ease}#FeedPage .post-card--inactive{opacity:.6}#FeedPage .post-card--inactive:hover{transform:none;box-shadow:0 6px 18px #0a0a0a0f}#FeedPage .post-card .card-link{color:inherit;text-decoration:none;display:block;height:100%;width:100%;position:relative}#FeedPage .post-card .card-link--disabled{cursor:not-allowed;pointer-events:auto}#FeedPage .post-card .post-card__inactive-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#00000059;border-radius:12px}#FeedPage .post-card .post-card__inactive-label{padding:6px 14px;background:#000000b3;color:#fff;font-size:14px;font-weight:600;border-radius:8px}#FeedPage .post-card .card-thumb{height:120px;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#fafafa,#f2f2f2);border-bottom:1px solid #eee;font-size:14px;color:#666;box-sizing:border-box;overflow:hidden;line-height:0}#FeedPage .post-card .card-thumb img{width:100%;height:100%;display:block;object-fit:cover;object-position:center;transition:opacity .16s ease;opacity:1}#FeedPage .post-card .card-thumb .img-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#999;font-size:13px}#FeedPage .post-card .card-body{padding:12px 14px;flex:1 1 auto;display:flex;flex-direction:column}#FeedPage .post-card .card-author{display:block;font-size:12px;color:#888;margin-bottom:4px}#FeedPage .post-card .card-title{font-size:14px;margin:0 0 8px;line-height:1.25;color:#111;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#FeedPage .post-card .card-excerpt{font-size:12px;color:#666;margin:0;line-height:1.4;flex:1 1 auto;overflow:hidden}#FeedPage .post-card:hover{transform:translateY(-6px);box-shadow:0 12px 30px #0a0a0a1f}@media(max-width:1100px){#FeedPage #FeedPage .container{max-width:960px}}@media(max-width:900px){#FeedPage #FeedPage .container{max-width:680px}}@media(max-width:560px){#FeedPage #FeedPage .container{max-width:360px}#FeedPage .post-card .card-thumb{height:100px}}#FeedPage .side-panel{position:fixed;top:400px;right:0;transform:translateY(-50%);width:30px;height:100%;min-height:140px;max-height:600px;background:#fff;border:1px solid #e6e6e6;border-radius:8px 0 0 8px;box-shadow:-4px 6px 18px #0000000f;overflow:hidden;transition:width .26s cubic-bezier(.2,.9,.3,1),transform .2s ease;z-index:900}#FeedPage .side-panel .panel-handle{width:30px;height:100%;display:flex;align-items:center;justify-content:center;cursor:pointer;background:#f6f6f6;border-radius:8px 0 0 8px;transition:background .16s ease}#FeedPage .side-panel .panel-handle span{display:inline-block;transform:translate(0);transition:transform .26s cubic-bezier(.2,.9,.3,1);font-size:16px;color:#666}#FeedPage .side-panel .panel-handle:hover{background:#f0f0f0}#FeedPage .side-panel .panel-handle:hover span{transform:translate(-2px)}#FeedPage .side-panel:hover{width:42px}#FeedPage .side-panel .panel-content{position:absolute;top:0;left:30px;width:270px;height:100%;padding:12px;opacity:0;visibility:hidden;transition:opacity .26s ease,visibility .26s ease;display:flex;flex-direction:column;justify-content:space-between;overflow-y:auto}#FeedPage .side-panel.open{width:300px}#FeedPage .side-panel.open .panel-content{opacity:1;visibility:visible}#FeedPage .side-panel.open .panel-handle span{transform:translate(0)}#FeedPage .drop-overlay{position:absolute;inset:0;pointer-events:none}#FeedPage .drop-overlay.active{pointer-events:auto;background:#0078d40f;border:2px dashed rgba(0,120,212,.2)}#FeedPage .dropped-snippet{border:1px dashed #cee;background:#fff;padding:8px;border-radius:8px;box-shadow:0 6px 18px #0000000f;z-index:50}#FeedPage .dropped-snippet>.react-resizable-handle{position:absolute;width:20px;height:20px}#FeedPage .dropped-snippet>.react-resizable-handle:after{content:"";position:absolute;right:6px;bottom:6px;width:5px;height:5px;border-right:2px solid rgba(0,0,0,.4);border-bottom:2px solid rgba(0,0,0,.4)}#FeedPage .dropped-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}#FeedPage .swiper-placeholder{background:linear-gradient(90deg,#f8f8f8,#fff);border:1px solid #eee;padding:8px;border-radius:6px}#FeedPage .snippet-palette{display:flex;flex-direction:column;gap:8px;margin-bottom:12px;flex:1}#FeedPage .snippet-item{padding:8px 10px;background:#fafafa;border:1px solid #eee;border-radius:6px;cursor:grab;-webkit-user-select:none;user-select:none}#FeedPage .skeleton-card{background:#fff;border:1px solid #eee;border-radius:12px;overflow:hidden;height:240px;display:flex;flex-direction:column}#FeedPage .skeleton-card .skeleton-thumb{height:120px;background:#f2f2f2;position:relative;overflow:hidden}#FeedPage .skeleton-card .skeleton-thumb:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);animation:skeleton-shimmer 1.5s infinite}#FeedPage .skeleton-card .skeleton-body{padding:12px 14px;display:flex;flex-direction:column;gap:10px}#FeedPage .skeleton-card .skeleton-body .skeleton-line{height:12px;background:#f2f2f2;border-radius:4px;position:relative;overflow:hidden}#FeedPage .skeleton-card .skeleton-body .skeleton-line:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);animation:skeleton-shimmer 1.5s infinite}#FeedPage .skeleton-card .skeleton-body .skeleton-line.title{width:80%;height:16px}#FeedPage .skeleton-card .skeleton-body .skeleton-line.text{width:100%}#FeedPage .skeleton-card .skeleton-body .skeleton-line.short{width:60%}@keyframes skeleton-shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}#FeedPage .empty-state{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 20px;text-align:center;background:#fafafa;border-radius:16px;border:2px dashed #eee;margin:20px 0}#FeedPage .empty-state .empty-icon{font-size:48px;margin-bottom:16px;opacity:.5}#FeedPage .empty-state .empty-text{font-size:18px;font-weight:600;color:#666;margin-bottom:8px}#FeedPage .empty-state .empty-subtext{font-size:14px;color:#999}:root{--swiper-navigation-size: 44px}.swiper-button-prev,.swiper-button-next{position:absolute;width:var(--swiper-navigation-size);height:var(--swiper-navigation-size);z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color, var(--swiper-theme-color))}:is(.swiper-button-prev,.swiper-button-next).swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}:is(.swiper-button-prev,.swiper-button-next).swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled :is(.swiper-button-prev,.swiper-button-next){display:none!important}:is(.swiper-button-prev,.swiper-button-next) svg{width:100%;height:100%;object-fit:contain;transform-origin:center;fill:currentColor;pointer-events:none}.swiper-button-lock{display:none}.swiper-button-prev,.swiper-button-next{top:var(--swiper-navigation-top-offset, 50%);margin-top:calc(0px - (var(--swiper-navigation-size) / 2))}.swiper-button-prev{left:var(--swiper-navigation-sides-offset, 4px);right:auto}.swiper-button-prev .swiper-navigation-icon{transform:rotate(180deg)}.swiper-button-next{right:var(--swiper-navigation-sides-offset, 4px);left:auto}.swiper-horizontal .swiper-button-prev,.swiper-horizontal .swiper-button-next,.swiper-horizontal~.swiper-button-prev,.swiper-horizontal~.swiper-button-next{top:var(--swiper-navigation-top-offset, 50%);margin-top:calc(0px - (var(--swiper-navigation-size) / 2));margin-left:0}.swiper-horizontal .swiper-button-prev,.swiper-horizontal~.swiper-button-prev,.swiper-horizontal.swiper-rtl .swiper-button-next,.swiper-horizontal.swiper-rtl~.swiper-button-next{left:var(--swiper-navigation-sides-offset, 4px);right:auto}.swiper-horizontal .swiper-button-next,.swiper-horizontal~.swiper-button-next,.swiper-horizontal.swiper-rtl .swiper-button-prev,.swiper-horizontal.swiper-rtl~.swiper-button-prev{right:var(--swiper-navigation-sides-offset, 4px);left:auto}:is(.swiper-horizontal .swiper-button-prev,.swiper-horizontal~.swiper-button-prev,.swiper-horizontal.swiper-rtl .swiper-button-next,.swiper-horizontal.swiper-rtl~.swiper-button-next) .swiper-navigation-icon{transform:rotate(180deg)}:is(.swiper-horizontal.swiper-rtl .swiper-button-prev,.swiper-horizontal.swiper-rtl~.swiper-button-prev) .swiper-navigation-icon{transform:rotate(0)}.swiper-vertical .swiper-button-prev,.swiper-vertical .swiper-button-next,.swiper-vertical~.swiper-button-prev,.swiper-vertical~.swiper-button-next{left:var(--swiper-navigation-top-offset, 50%);right:auto;margin-left:calc(0px - (var(--swiper-navigation-size) / 2));margin-top:0}.swiper-vertical .swiper-button-prev,.swiper-vertical~.swiper-button-prev{top:var(--swiper-navigation-sides-offset, 4px);bottom:auto}:is(.swiper-vertical .swiper-button-prev,.swiper-vertical~.swiper-button-prev) .swiper-navigation-icon{transform:rotate(-90deg)}.swiper-vertical .swiper-button-next,.swiper-vertical~.swiper-button-next{bottom:var(--swiper-navigation-sides-offset, 4px);top:auto}:is(.swiper-vertical .swiper-button-next,.swiper-vertical~.swiper-button-next) .swiper-navigation-icon{transform:rotate(90deg)}:root{--swiper-theme-color: #007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function, initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translateZ(0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-slide,.swiper-3d .swiper-cube-shadow{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-slides-offset-before);scroll-margin-inline-start:var(--swiper-slides-offset-before)}.swiper-css-mode.swiper-horizontal>.swiper-wrapper>.swiper-slide:last-child{margin-inline-end:var(--swiper-slides-offset-after)}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-slides-offset-before);scroll-margin-block-start:var(--swiper-slides-offset-before)}.swiper-css-mode.swiper-vertical>.swiper-wrapper>.swiper-slide:last-child{margin-block-end:var(--swiper-slides-offset-after)}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper:before{content:"";flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper:before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper:before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top,.swiper-3d .swiper-slide-shadow-bottom{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:#00000026}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,#00000080,#0000)}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color, var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}:is(.swiper:not(.swiper-watch-progress),.swiper-watch-progress .swiper-slide-visible) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color: #fff}.swiper-lazy-preloader-black{--swiper-preloader-color: #000}@keyframes swiper-preloader-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.chat-room-users-modal .modal-content{background:#1e1e1e;border:1px solid rgba(255,255,255,.3);border-radius:15px;width:90%;max-width:500px;max-height:80vh;color:#fff;overflow:hidden;display:flex;flex-direction:column}.chat-room-users-modal .modal-content .modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 30px;border-bottom:1px solid rgba(255,255,255,.2);background:#2a2a2a}.chat-room-users-modal .modal-content .modal-header h3{margin:0;display:flex;align-items:center;gap:10px;font-size:24px;color:#fff}.chat-room-users-modal .modal-content .modal-header h3 .room-indicator{font-size:1.2em}.chat-room-users-modal .modal-content .modal-header .close-button{background:transparent;border:none;color:#ccc;font-size:28px;cursor:pointer;width:40px;height:40px;display:flex;justify-content:center;border-radius:50%;transition:all .3s ease}.chat-room-users-modal .modal-content .modal-header .close-button:hover{background:#ffffff1a;color:#fff;transform:scale(1.1)}.chat-room-users-modal .modal-content .modal-body{flex:1;padding:20px 30px;overflow-y:auto}.chat-room-users-modal .modal-content .modal-body .loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 0}.chat-room-users-modal .modal-content .modal-body .loading-state .loading-spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.2);border-top:3px solid #4a90e2;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:15px}.chat-room-users-modal .modal-content .modal-body .loading-state p{color:#ccc;margin:0;font-size:14px}.chat-room-users-modal .modal-content .modal-body .error-state{text-align:center;padding:30px 0}.chat-room-users-modal .modal-content .modal-body .error-state .error-message{color:#e74c3c;margin:0 0 20px;font-size:14px}.chat-room-users-modal .modal-content .modal-body .error-state .retry-button{background:#9cc385;color:#121212;border:none;padding:10px 20px;border-radius:10px;cursor:pointer;font-size:14px;transition:all .3s ease}.chat-room-users-modal .modal-content .modal-body .error-state .retry-button:hover{background:#c9fbad;transform:translateY(-1px)}.chat-room-users-modal .modal-content .modal-body .users-count{text-align:center;margin-bottom:20px;padding:10px 15px;background:#ffffff1a;border-radius:10px;font-size:14px;color:#ccc}.chat-room-users-modal .modal-content .modal-body .users-count .count-number{color:#9cc385;font-weight:600;font-size:16px}.chat-room-users-modal .modal-content .modal-body .users-list .no-users{text-align:center;color:#aaa;font-style:italic;padding:30px 0}.chat-room-users-modal .modal-content .modal-body .users-list .user-item{display:flex;align-items:center;gap:15px;padding:15px;border-radius:10px;margin-bottom:10px;background:#ffffff1a;border:1px solid transparent;transition:all .3s ease}.chat-room-users-modal .modal-content .modal-body .users-list .user-item:hover{background:#ffffff26;border-color:#ffffff4d;transform:translateY(-1px)}.chat-room-users-modal .modal-content .modal-body .users-list .user-item.current-user{background:#9cc3851a;border-color:#9cc3854d}.chat-room-users-modal .modal-content .modal-body .users-list .user-item.current-user:hover{background:#9cc38526}.chat-room-users-modal .modal-content .modal-body .users-list .user-item .user-avatar{position:relative;flex-shrink:0}.chat-room-users-modal .modal-content .modal-body .users-list .user-item .user-avatar .avatar-circle{width:50px;height:50px;border-radius:50%;background:linear-gradient(135deg,#4a90e2,#667eea);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:16px;border:2px solid rgba(255,255,255,.3)}.chat-room-users-modal .modal-content .modal-body .users-list .user-item .user-avatar .avatar-circle img{width:100%;height:100%;border-radius:50%;object-fit:cover}.chat-room-users-modal .modal-content .modal-body .users-list .user-item .user-avatar .online-indicator{position:absolute;bottom:2px;right:2px;width:14px;height:14px;background:#4caf50;border:2px solid #1e1e1e;border-radius:50%;animation:pulse 2s infinite}.chat-room-users-modal .modal-content .modal-body .users-list .user-item .user-info{flex:1;min-width:0}.chat-room-users-modal .modal-content .modal-body .users-list .user-item .user-info .user-name{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:600;color:#fff;margin-bottom:4px}.chat-room-users-modal .modal-content .modal-body .users-list .user-item .user-info .user-name .current-user-badge{background:#9cc385;color:#121212;font-size:11px;padding:2px 6px;border-radius:8px;font-weight:500}.chat-room-users-modal .modal-content .modal-body .users-list .user-item .user-info .user-details{display:flex;flex-direction:column;gap:2px}.chat-room-users-modal .modal-content .modal-body .users-list .user-item .user-info .user-details .join-time,.chat-room-users-modal .modal-content .modal-body .users-list .user-item .user-info .user-details .last-seen{font-size:11px;color:#aaa}@media(max-width:768px){.chat-room-users-modal .modal-content{width:95%;max-height:90vh}.chat-room-users-modal .modal-content .modal-header{padding:15px 20px}.chat-room-users-modal .modal-content .modal-header h3{font-size:16px}.chat-room-users-modal .modal-content .modal-body{padding:15px 20px}.chat-room-users-modal .modal-content .modal-body .user-item .user-avatar .avatar-circle{width:40px;height:40px;font-size:14px}.chat-room-users-modal .modal-content .modal-body .user-item .user-info .user-name{font-size:14px}}@media(max-width:480px){.chat-room-users-modal .modal-content .modal-header h3{flex-direction:column;gap:4px;text-align:center}.chat-room-users-modal .modal-content .modal-body .user-item{flex-direction:column;text-align:center}.chat-room-users-modal .modal-content .modal-body .user-item .user-info .user-details{align-items:center}}#ChatPage{color:#fff;background-color:#121212}#ChatPage .container{display:flex;flex:1;justify-content:space-between;padding:20px;gap:20px}.chat-area{position:relative;flex:.45;min-width:0;z-index:999}.chat-area .chat-wrapper{position:sticky;top:0}.chat-area .chat-wrapper .chat-area-header{width:100%;min-height:100px;display:flex;justify-content:space-between;align-items:center;padding:15px 20px;gap:20px;flex-wrap:wrap}.chat-area .chat-wrapper .chat-area-header .chat-area-header-title{flex:1;min-width:200px;display:flex;flex-direction:column;justify-content:center}.chat-area .chat-wrapper .chat-area-header .chat-area-header-title h1{margin:0;color:#fff;font-size:24px}.chat-area .chat-wrapper .chat-area-header .chat-area-header-title .current-chat-room{display:flex;align-items:center;gap:.5rem;margin-top:.5rem;padding:.5rem 1rem;background:#4a90e21a;border-radius:20px;font-size:.9rem;color:#ccc;flex-wrap:wrap;transition:all .3s ease;border:1px solid transparent}.chat-area .chat-wrapper .chat-area-header .chat-area-header-title .current-chat-room.clickable{cursor:pointer}.chat-area .chat-wrapper .chat-area-header .chat-area-header-title .current-chat-room.clickable:hover{background:#4a90e233;border-color:#4a90e24d;transform:translateY(-1px);box-shadow:0 4px 12px #4a90e233}.chat-area .chat-wrapper .chat-area-header .chat-area-header-title .current-chat-room.clickable:hover .room-name{color:#9cc385}.chat-area .chat-wrapper .chat-area-header .chat-area-header-title .current-chat-room.clickable:hover .room-users{opacity:1;color:#fff}.chat-area .chat-wrapper .chat-area-header .chat-area-header-title .current-chat-room.clickable:active{transform:translateY(0)}.chat-area .chat-wrapper .chat-area-header .chat-area-header-title .current-chat-room .room-indicator{font-size:1rem;flex-shrink:0;transition:all .3s ease}.chat-area .chat-wrapper .chat-area-header .chat-area-header-title .current-chat-room .room-name{font-weight:600;color:#fff;word-break:break-word;transition:all .3s ease}.chat-area .chat-wrapper .chat-area-header .chat-area-header-title .current-chat-room .room-users{font-size:.8rem;opacity:.7;flex-shrink:0;transition:all .3s ease}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section{flex-shrink:0;min-width:250px;display:flex;flex-direction:column;justify-content:center}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-display-container{display:flex;align-items:center;gap:15px;flex-wrap:wrap}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-display-container .current-nickname{display:flex;align-items:center;gap:8px;background-color:#ffffff1a;padding:8px 20px;border-radius:20px;border:1px solid rgba(255,255,255,.2)}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-display-container .current-nickname .nickname-label{color:#ccc;font-size:14px;font-weight:500}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-display-container .current-nickname .nickname-value{color:#fff;font-size:16px;font-weight:600;min-width:60px}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-display-container .edit-btn{padding:8px 12px;background-color:#9cc385;color:#000;border:none;border-radius:15px;font-size:14px;font-weight:500;cursor:pointer;transition:all .3s ease}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-display-container .edit-btn:hover{background-color:#c9fbad;transform:translateY(-1px)}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-edit-container{display:flex;flex-direction:column;gap:10px}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-edit-container .nickname-input-wrapper{position:relative}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-edit-container .nickname-input-wrapper .nickname-input{padding:10px 15px;border:2px solid rgba(255,255,255,.3);border-radius:20px;background-color:#ffffff1a;color:#fff;font-size:16px;outline:none;min-width:200px;transition:all .3s ease}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-edit-container .nickname-input-wrapper .nickname-input::placeholder{color:#fff9}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-edit-container .nickname-input-wrapper .nickname-input:focus{border-color:#9cc385;background-color:#ffffff26;box-shadow:0 0 0 3px #9cc38533}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-edit-container .nickname-input-wrapper .nickname-input.error{border-color:#e74c3c}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-edit-container .nickname-input-wrapper .nickname-input.error:focus{box-shadow:0 0 0 3px #e74c3c33}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-edit-container .nickname-input-wrapper .nickname-error{position:absolute;top:100%;left:0;margin-top:5px;color:#e74c3c;font-size:12px;font-weight:500;white-space:nowrap;background-color:#e74c3c1a;padding:4px 8px;border-radius:8px;border:1px solid rgba(231,76,60,.3)}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-edit-container .nickname-buttons{display:flex;gap:8px}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-edit-container .nickname-buttons button{padding:8px 20px;border:none;border-radius:15px;font-size:14px;font-weight:500;cursor:pointer;transition:all .3s ease}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-edit-container .nickname-buttons button.save-btn{background-color:#9cc385;color:#000}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-edit-container .nickname-buttons button.save-btn:hover{background-color:#c9fbad;transform:translateY(-1px)}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-edit-container .nickname-buttons button.cancel-btn{background-color:#fff3;color:#fff;border:1px solid rgba(255,255,255,.3)}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-edit-container .nickname-buttons button.cancel-btn:hover{background-color:#ffffff4d;transform:translateY(-1px)}@media(max-width:768px){.chat-area .chat-wrapper .chat-area-header{flex-direction:column;align-items:stretch;gap:15px}.chat-area .chat-wrapper .chat-area-header .chat-area-header-title{min-width:unset;text-align:center}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section{min-width:unset;align-items:center}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-display-container{justify-content:center}.chat-area .chat-wrapper .chat-area-header .chat-nick-name-section .nickname-edit-container{align-items:center;text-align:center}}@media(max-width:480px){.chat-area .chat-wrapper .chat-area-header .current-chat-room{justify-content:center;text-align:center}.chat-area .chat-wrapper .chat-area-header .nickname-display-container{flex-direction:column;gap:10px}.chat-area .chat-wrapper .chat-area-header .nickname-edit-container .nickname-buttons{justify-content:center}}.chat-area .chat-wrapper .chat-area-content{height:700px;margin:0 auto;background-color:#fff;color:#000;border-radius:10px;padding:20px;overflow-y:auto;scroll-behavior:smooth}.chat-area .chat-wrapper .chat-area-content .loading,.chat-area .chat-wrapper .chat-area-content .error{text-align:center;padding:20px;font-weight:500}.chat-area .chat-wrapper .chat-area-content .error{color:#e74c3c}.chat-area .chat-wrapper .chat-area-content .debug-info{background-color:#4a90e21a;border:1px solid rgba(74,144,226,.3);color:#4a90e2;padding:8px 12px;border-radius:6px;margin-bottom:10px;font-family:monospace;text-align:left}.chat-area .chat-wrapper .chat-area-content .debug-info small{font-size:11px;opacity:.8}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container{display:flex;flex-direction:column;gap:10px}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message{max-width:70%;display:flex;align-items:flex-start;gap:10px;margin-bottom:10px}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message.own-message{align-self:flex-end;flex-direction:row-reverse}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message.own-message .message-content-wrapper{background-color:#9cc385;color:#000}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message.own-message .message-content-wrapper .message-header{text-align:right}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message.other-message{align-self:flex-start}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message.other-message .message-content-wrapper{background-color:#f1f1f1;color:#000}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message.other-message .message-content-wrapper .message-header{flex-direction:row}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message .profile-photo-container{flex-shrink:0;width:40px;height:40px;margin-top:4px}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message .profile-photo-container .profile-photo{width:100%;height:100%;border-radius:50%;object-fit:cover;border:2px solid #e0e0e0;transition:all .3s ease}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message .profile-photo-container .profile-photo:hover{border-color:#9cc385;transform:scale(1.05)}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message .profile-photo-container .profile-photo.clickable{cursor:pointer}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message .profile-photo-container .profile-photo.clickable:hover{border-color:#9cc385;transform:scale(1.1);box-shadow:0 4px 12px #00000026}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message .profile-photo-container .profile-photo.clickable:active{transform:scale(1.05)}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message .message-content-wrapper{flex:1;padding:10px 15px;border-radius:15px;word-wrap:break-word;min-width:0}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message .message-content-wrapper .message-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:5px;font-size:12px;gap:8px}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message .message-content-wrapper .message-header .user-name{font-weight:600;flex:1}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message .message-content-wrapper .message-header .timestamp{opacity:.7;font-size:11px;white-space:nowrap;color:var(--text-secondary);font-weight:400;min-width:fit-content}@media(max-width:768px){.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message .message-content-wrapper .message-header .timestamp{font-size:10px}}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message .message-content-wrapper .message-header .delete-button{background:transparent;border:none;color:#f44;cursor:pointer;font-size:11px;padding:2px 6px;border-radius:4px;transition:all .3s ease;flex-shrink:0}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message .message-content-wrapper .message-header .delete-button:hover{background-color:#ff44441a}.chat-area .chat-wrapper .chat-area-content .chat-message .messages-container .message .message-content-wrapper .message-content{font-size:14px;line-height:1.4}.chat-area .chat-wrapper .chat-area-input{height:100px;display:flex;align-items:center;justify-content:center;gap:20px}.chat-area .chat-wrapper .chat-area-input input{width:80%;height:50px;padding:10px;border:1px solid #ccc;border-radius:10px;font-size:14px;outline:none}.chat-area .chat-wrapper .chat-area-input button{width:110px;height:50px;border-radius:10px;background-color:#9cc385;color:#000;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease;border:none}.chat-area .chat-wrapper .chat-area-input button:hover:not(:disabled){background-color:#c9fbad}.chat-area .chat-wrapper .chat-area-input button:disabled{opacity:.6;cursor:not-allowed}.list-area{flex:1;min-width:300px;display:flex;flex-direction:column;gap:20px}#ChatRoomList{width:100%;border:1px solid rgba(255,255,255,.2);border-radius:10px;padding:20px;background:#1e1e1e;box-shadow:0 4px 12px #0000004d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}#ChatRoomList:hover{border-color:#9cc385;box-shadow:0 12px 40px #9cc38526}#ChatRoomList .chat-room-list-header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(255,255,255,.2);text-align:center;padding-bottom:10px}#ChatRoomList .chat-room-list-header h3{color:#9cc385;font-size:1.2rem}#ChatRoomList .chat-room-list-header .current-room{color:#9cc385;font-size:.9rem}#ChatRoomList .chat-room-list-header .current-room strong{color:#4a90e2}#ChatRoomList .chat-room-list-header .create-room-btn{background-color:#9cc385;color:#fff;border:1px solid #9cc385;padding:8px 15px;border-radius:20px;cursor:pointer;font-size:12px;transition:all .3s ease}#ChatRoomList .chat-room-list-header .create-room-btn:hover{background-color:#c9fbad;color:#121212}#ChatRoomList .login-notice{background:#ffffff1a;padding:15px;border-radius:10px;margin-bottom:20px}#ChatRoomList .login-notice p{margin:0;color:#ccc;font-size:14px}#ChatRoomList .chat-room-swiper{width:100%;padding:20px 0}#ChatRoomList .chat-room-swiper .swiper-slide{width:280px;height:200px}#ChatRoomList .chat-room-swiper .swiper-slide .chat-room-card{position:relative;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:15px;padding:1.5rem;height:100%;display:flex;flex-direction:column;justify-content:space-between;transition:all .3s ease;cursor:pointer;-webkit-user-select:none;user-select:none;z-index:10;pointer-events:auto}#ChatRoomList .chat-room-swiper .swiper-slide .chat-room-card:hover{background:#ffffff26;border-color:#4a90e280;transform:translateY(-2px)}#ChatRoomList .chat-room-swiper .swiper-slide .chat-room-card:hover .delete-room-btn{opacity:1}#ChatRoomList .chat-room-swiper .swiper-slide .chat-room-card.active{background:#4a90e233;border-color:#4a90e2;box-shadow:0 0 20px #4a90e24d}#ChatRoomList .chat-room-swiper .swiper-slide .chat-room-card .delete-room-btn{position:absolute;top:10px;right:10px;background:#ff3b30cc;border:none;border-radius:50%;width:30px;height:30px;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;transition:all .3s ease;opacity:0;z-index:10;pointer-events:auto}#ChatRoomList .chat-room-swiper .swiper-slide .chat-room-card .delete-room-btn:hover{background:#ff3b30;transform:scale(1.1)}#ChatRoomList .chat-room-swiper .swiper-slide .chat-room-card .room-name{color:#fff;font-size:1.1rem;font-weight:600;margin-bottom:.5rem}#ChatRoomList .chat-room-swiper .swiper-slide .chat-room-card .room-info{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem}#ChatRoomList .chat-room-swiper .swiper-slide .chat-room-card .room-info .room-users{color:#ccc;font-size:.8rem;background:#ffffff1a;padding:.2rem .5rem;border-radius:10px}#ChatRoomList .chat-room-swiper .swiper-slide .chat-room-card .room-info .room-private{font-size:.9rem}#ChatRoomList .chat-room-swiper .swiper-slide .chat-room-card .room-description{color:#ccc;font-size:.85rem;line-height:1.4;flex-grow:1;margin-bottom:.5rem}#ChatRoomList .chat-room-swiper .swiper-slide .chat-room-card .room-admin{color:#aaa;font-size:.75rem;opacity:.8}#ChatRoomList .chat-room-swiper .swiper-button-next,#ChatRoomList .chat-room-swiper .swiper-button-prev{color:#9cc385;background:#00000080;width:40px;height:40px;border-radius:50%;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}#ChatRoomList .chat-room-swiper .swiper-button-next:hover,#ChatRoomList .chat-room-swiper .swiper-button-prev:hover{background:#9cc385;color:#121212;transform:scale(1.1)}#ChatRoomList .chat-room-swiper .swiper-button-next:after,#ChatRoomList .chat-room-swiper .swiper-button-prev:after{font-size:16px;font-weight:700}#ChatRoomList .no-rooms{text-align:center;color:#ccc;padding:2rem;font-style:italic}.modal-overlay{position:fixed;inset:0;background:#000000b3;display:flex;justify-content:center;align-items:center;z-index:10000}.modal-overlay .modal-content{background:#1e1e1e;padding:30px;border-radius:15px;width:90%;max-width:500px;color:#fff}.modal-overlay .modal-content h3{margin:0 0 20px;text-align:center;color:#fff}.modal-overlay .modal-content .form-group{margin-bottom:20px}.modal-overlay .modal-content .form-group label{display:block;margin-bottom:8px;color:#ccc;font-size:14px}.modal-overlay .modal-content .form-group input,.modal-overlay .modal-content .form-group textarea{width:100%;padding:12px;border:1px solid #444;border-radius:8px;background:#2a2a2a;color:#fff;font-size:14px;box-sizing:border-box}.modal-overlay .modal-content .form-group input:focus,.modal-overlay .modal-content .form-group textarea:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 2px #667eea33}.modal-overlay .modal-content .form-group input::placeholder,.modal-overlay .modal-content .form-group textarea::placeholder{color:#666}.modal-overlay .modal-content .form-group input[type=checkbox]{width:auto;margin-right:8px}.modal-overlay .modal-content .modal-buttons{display:flex;gap:10px;justify-content:flex-end;margin-top:30px}.modal-overlay .modal-content .modal-buttons button{padding:10px 20px;border:none;border-radius:8px;cursor:pointer;font-size:14px;transition:all .3s ease}.modal-overlay .modal-content .modal-buttons button.create-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.modal-overlay .modal-content .modal-buttons button.create-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #667eea66}.modal-overlay .modal-content .modal-buttons button.cancel-btn{background:#444;color:#ccc}.modal-overlay .modal-content .modal-buttons button.cancel-btn:hover{background:#555;color:#fff}.modal-overlay .password-modal{max-width:400px;text-align:center}.modal-overlay .password-modal h3{color:#9cc385;margin-bottom:15px}.modal-overlay .password-modal p{color:#ccc;margin-bottom:20px;line-height:1.5}.modal-overlay .password-modal p strong{color:#fff}.modal-overlay .password-modal .form-group{text-align:left;margin-bottom:20px}.modal-overlay .password-modal .form-group label{display:block;margin-bottom:8px;color:#ccc;font-size:12px}.modal-overlay .password-modal .form-group input{width:100%;padding:10px;border:2px solid rgba(255,255,255,.2);border-radius:8px;background:#2a2a2a;color:#fff;font-size:14px;text-align:center;letter-spacing:2px;transition:all .3s ease}.modal-overlay .password-modal .form-group input:focus{outline:none;border-color:#9cc385;box-shadow:0 0 0 3px #9cc38533}.modal-overlay .password-modal .form-group input.error{border-color:#e74c3c;box-shadow:0 0 0 3px #e74c3c33}.modal-overlay .password-modal .form-group input::placeholder{color:#666;letter-spacing:normal}.modal-overlay .password-modal .form-group .error-message{color:#e74c3c;font-size:11px;margin-top:8px;text-align:center}.modal-overlay .password-modal .modal-buttons{display:flex;gap:10px;justify-content:center}.modal-overlay .password-modal .modal-buttons .submit-btn{background:#9cc385;color:#121212;padding:10px 20px;border:none;border-radius:8px;cursor:pointer;font-size:14px;transition:all .3s ease}.modal-overlay .password-modal .modal-buttons .submit-btn:hover{background:#c9fbad;transform:translateY(-1px)}.modal-overlay .password-modal .modal-buttons .cancel-btn{background:transparent;color:#ccc;border:1px solid rgba(255,255,255,.2);padding:10px 20px;border-radius:8px;cursor:pointer;font-size:14px;transition:all .3s ease}.modal-overlay .password-modal .modal-buttons .cancel-btn:hover{background:#ffffff1a;color:#fff}.modal-overlay .chat-room-card .room-private{margin-left:8px;font-size:12px;opacity:.8;cursor:help}.modal-overlay .chat-room-card .system-badge{position:absolute;top:8px;right:8px;background:linear-gradient(135deg,#4caf50,#45a049);color:#fff;font-size:11px;padding:2px 6px;border-radius:8px;font-weight:700;cursor:help;z-index:10;pointer-events:auto}.modal-overlay .chat-room-card.system-room{border:2px solid #4caf50;background:linear-gradient(135deg,#f0f8f0,#e8f5e8)}.modal-overlay .chat-room-card.system-room .room-name{color:#2e7d32;font-weight:700}.modal-overlay .chat-room-card.user-room{border:2px solid #2196f3;background:linear-gradient(135deg,#f0f8ff,#e8f4ff)}@media(max-width:1024px){#ChatPage .container{flex-direction:column;gap:15px}.chat-area{flex:none;order:1}.list-area{flex:none;min-width:unset;order:2}}@media(max-width:768px){#ChatPage .container{padding:10px}}.login-required-message{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;padding:20px;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border:2px dashed #6c757d;border-radius:15px;text-align:center}.login-required-message span{color:#495057;font-size:14px;font-weight:500}.login-required-message .login-prompt-btn{background:linear-gradient(135deg,#007bff,#0056b3);color:#fff;border:none;padding:10px 20px;border-radius:10px;font-size:14px;font-weight:500;cursor:pointer;transition:all .3s ease}.login-required-message .login-prompt-btn:hover{background:linear-gradient(135deg,#0056b3,#004085);transform:translateY(-2px);box-shadow:0 4px 12px #007bff4d}.login-required-message .login-prompt-btn:active{transform:translateY(0)}.user-playlist-comp{background:linear-gradient(135deg,#1e1e1e,#2a2a2a);border:1px solid rgba(255,255,255,.2);border-radius:15px;padding:20px;margin:15px 0;box-shadow:0 8px 32px #0000004d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease;overflow:hidden;min-width:0}.user-playlist-comp:hover{border-color:#9cc385;box-shadow:0 12px 40px #9cc38526}.user-playlist-comp.loading,.user-playlist-comp.error,.user-playlist-comp.empty{text-align:center;padding:30px}.user-playlist-comp.loading p,.user-playlist-comp.error p,.user-playlist-comp.empty p{color:#ccc;font-size:14px;margin:0}.user-playlist-comp.loading button,.user-playlist-comp.error button,.user-playlist-comp.empty button{margin-top:15px;background:#9cc385;color:#121212;border:none;padding:8px 15px;border-radius:10px;cursor:pointer;font-weight:600;transition:all .3s ease}.user-playlist-comp.loading button:hover,.user-playlist-comp.error button:hover,.user-playlist-comp.empty button:hover{background:#c9fbad;transform:translateY(-1px)}.user-playlist-comp .playlist-header{display:flex;align-items:center;flex-direction:column;margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid rgba(255,255,255,.2)}.user-playlist-comp .playlist-header .playlist-title-section{width:100%;display:flex;align-items:center;justify-content:space-between}.user-playlist-comp .playlist-header .playlist-title-section h4{margin:0;font-size:16px;font-weight:700;color:#fff;display:flex;align-items:center;gap:8px;background:linear-gradient(135deg,#9cc385,#c9fbad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.user-playlist-comp .playlist-header .playlist-title-section .play-all-btn{display:inline-flex;align-items:center;gap:8px;padding:8px 15px;background:#9cc385;color:#fff;border:none;border-radius:20px;font-size:12px;font-weight:500;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 4px 0 0 20px #4a90e24d}.user-playlist-comp .playlist-header .playlist-title-section .play-all-btn:hover{background:#c9fbad;color:#121212;box-shadow:0 4px 8px 0 0 20px #4a90e24d}.user-playlist-comp .playlist-header .playlist-title-section .play-all-btn:active{transform:translateY(0)}.user-playlist-comp .playlist-header .playlist-title-section .play-all-btn svg{width:14px;height:14px}.user-playlist-comp .playlist-header .playlist-list-section,.user-playlist-comp .playlist-header .playlist-list-section .playlist-selector{width:100%;min-width:0;overflow:hidden}.user-playlist-comp .playlist-header .playlist-list-section .playlist-selector .playlist-tabs{display:flex;gap:8px;flex-wrap:nowrap;min-width:0;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}.user-playlist-comp .playlist-header .playlist-list-section .playlist-selector .playlist-tabs .playlist-tab{flex-shrink:0;padding:8px 15px;background:#121212;border:1px solid rgba(255,255,255,.2);border-radius:20px;color:#fff;font-size:12px;font-weight:500;cursor:pointer;transition:all .3s ease;white-space:nowrap}.user-playlist-comp .playlist-header .playlist-list-section .playlist-selector .playlist-tabs .playlist-tab:hover{background:#ffffff1a;color:#fff;border-color:#4a90e2}.user-playlist-comp .playlist-header .playlist-list-section .playlist-selector .playlist-tabs .playlist-tab.active{background:#4a90e2;color:#fff;border-color:#4a90e2;box-shadow:0 2px 4px #9cc3854d}.user-playlist-comp .user-playlist-swiper{margin-bottom:15px;border-radius:10px;overflow:hidden}.user-playlist-comp .user-playlist-swiper .swiper-slide{display:flex;justify-content:center}.user-playlist-comp .user-playlist-swiper .song-card{background:linear-gradient(135deg,#2a2a2a,#ffffff0d);border:1px solid rgba(255,255,255,.2);border-radius:10px;padding:15px;transition:all .3s ease;color:#fff;width:100%;max-width:280px;box-shadow:0 4px 16px #0003}.user-playlist-comp .user-playlist-swiper .song-card:hover{box-shadow:0 12px 32px #9cc38533;border-color:#9cc385}.user-playlist-comp .user-playlist-swiper .song-card .song-thumbnail{position:relative;width:100%;aspect-ratio:16/9;border-radius:8px;overflow:hidden;margin-bottom:10px;box-shadow:0 4px 12px #0000004d}.user-playlist-comp .user-playlist-swiper .song-card .song-thumbnail img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.user-playlist-comp .user-playlist-swiper .song-card .song-thumbnail:hover img{transform:scale(1.05)}.user-playlist-comp .user-playlist-swiper .song-card .song-thumbnail .song-overlay{position:absolute;inset:0;background:linear-gradient(45deg,#000000b3,#0000004d);display:flex;align-items:center;justify-content:center;gap:15px;opacity:0;transition:all .3s ease}.user-playlist-comp .user-playlist-swiper .song-card .song-thumbnail .song-overlay button{background:#ffffffe6;border:none;border-radius:50%;width:48px;height:48px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;font-size:18px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 4px 12px #0000004d}.user-playlist-comp .user-playlist-swiper .song-card .song-thumbnail .song-overlay button:hover{transform:scale(1.1);background:#9cc385;color:#121212}.user-playlist-comp .user-playlist-swiper .song-card .song-thumbnail .song-overlay button.play-btn:hover{background:#4a90e2;color:#fff}.user-playlist-comp .user-playlist-swiper .song-card .song-thumbnail .song-overlay button.external-btn:hover{background:#9cc385;color:#121212}.user-playlist-comp .user-playlist-swiper .song-card .song-thumbnail:hover .song-overlay{opacity:1}.user-playlist-comp .user-playlist-swiper .song-card .song-info{text-align:center}.user-playlist-comp .user-playlist-swiper .song-card .song-info .song-title{margin:0 0 8px;font-size:14px;font-weight:600;color:#fff;line-height:1.3;min-height:2.6em;display:flex;align-items:center;justify-content:center}.user-playlist-comp .user-playlist-swiper .song-card .song-info .playlist-name{margin:0;font-size:11px;color:#aaa;font-weight:500;background:#ffffff1a;padding:4px 8px;border-radius:8px;display:inline-block}.user-playlist-comp .user-playlist-swiper .swiper-button-next,.user-playlist-comp .user-playlist-swiper .swiper-button-prev{color:#9cc385;background:#00000080;width:40px;height:40px;border-radius:50%;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}.user-playlist-comp .user-playlist-swiper .swiper-button-next:hover,.user-playlist-comp .user-playlist-swiper .swiper-button-prev:hover{background:#9cc385;color:#121212;transform:scale(1.1)}.user-playlist-comp .user-playlist-swiper .swiper-button-next:after,.user-playlist-comp .user-playlist-swiper .swiper-button-prev:after{font-size:16px;font-weight:700}.user-playlist-comp .user-playlist-thumbs .swiper-slide{opacity:.6;cursor:pointer}.user-playlist-comp .user-playlist-thumbs .swiper-slide.swiper-slide-thumb-active{opacity:1}.user-playlist-comp .user-playlist-thumbs .swiper-slide:hover{opacity:.8}.user-playlist-comp .user-playlist-thumbs .thumb-card{border-radius:8px;overflow:hidden;aspect-ratio:16/9;border:2px solid transparent;transition:all .3s ease;box-shadow:0 2px 8px #0003}.user-playlist-comp .user-playlist-thumbs .thumb-card img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.user-playlist-comp .user-playlist-thumbs .thumb-card:hover{border-color:#9cc385;box-shadow:0 4px 16px #9cc3854d}.user-playlist-comp .user-playlist-thumbs .thumb-card:hover img{transform:scale(1.05)}.user-playlist-comp .user-playlist-thumbs .swiper-slide-thumb-active .thumb-card{border-color:#9cc385;box-shadow:0 0 20px #9cc38566}.music-share-message .music-share-text{margin-bottom:10px;font-size:12px;color:#121212}.music-share-message .music-share-card{display:flex;align-items:center;background:#2a2a2a;border:1px solid rgba(255,255,255,.2);border-radius:10px;padding:10px;margin-top:8px;cursor:pointer;transition:all .3s ease;max-width:300px}.music-share-message .music-share-card:hover{background:#121212;border-color:#c9fbad;transform:translateY(-1px);box-shadow:0 4px 12px #9cc38533}.music-share-message .music-share-card .music-thumbnail{position:relative;width:60px;height:60px;border-radius:8px;overflow:hidden;flex-shrink:0;margin-right:10px}.music-share-message .music-share-card .music-thumbnail img{width:100%;height:100%;object-fit:cover}.music-share-message .music-share-card .music-thumbnail .play-overlay{position:absolute;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;opacity:0;transition:all .3s ease}.music-share-message .music-share-card .music-thumbnail .play-overlay .play-icon{font-size:20px;color:#fff}.music-share-message .music-share-card .music-thumbnail:hover .play-overlay{opacity:1}.music-share-message .music-share-card .music-info{flex:1;text-align:left;min-width:0}.music-share-message .music-share-card .music-info .music-title{font-size:14px;font-weight:600;color:#fff;margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.music-share-message .music-share-card .music-info .music-playlist{font-size:11px;color:#aaa;margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.music-share-message .music-share-card .music-info .click-hint{font-size:11px;color:#aaa;font-style:italic}.playlistItem{display:flex;align-items:center;border:2px solid #222;border-radius:30px;padding:8px 16px;margin-bottom:10px;background:#fff;min-height:50px;box-sizing:border-box;position:relative}.playlistItem a{flex:1;display:flex}.playlistItem a .playlist-item-number{font-size:1.2rem;color:#090;font-weight:700;margin-right:12px}.playlistItem a .playlist-item-profile{width:32px;height:32px;background:#eee;margin-right:12px;display:flex;align-items:center;justify-content:center}.playlistItem a .playlist-item-profile img{border-radius:5px}.playlistItem a .playlist-item-title{flex:1;font-size:1.1rem;color:#222;margin-left:10px}.playlistItem .playlist-item-drag{margin-right:12px;width:24px;height:24px;display:flex;align-items:center;justify-content:center;cursor:grab}.playlistItem .playlist-item-controls{display:flex;gap:6px;width:54px}.playlistItem .playlist-item-controls .playlist-item-btn{width:24px;height:24px;border-radius:50%;border:none;color:#fff;display:inline-flex;align-items:center;justify-content:center;line-height:1;cursor:pointer;padding-left:0}.playlistItem .playlist-item-controls .playlist-item-del-btn{background:#e53935}.playlistItem .playlist-item-controls .playlist-item-del-btn:focus{outline:2px solid rgba(0,0,0,.15);outline-offset:2px}.playlistItem .playlist-item-controls .playlist-item-play-btn{background:#1e88e5;display:inline-flex;align-items:center;justify-content:center}.playlistItem .playlist-item-controls .playlist-item-play-btn:focus{outline:2px solid rgba(30,136,229,.25);outline-offset:2px}.import-modal-overlay{position:fixed;inset:0;background:#0000008c;display:flex;align-items:center;justify-content:center;z-index:9999}.import-modal{background:#fff;border-radius:12px;width:500px;max-width:92vw;max-height:72vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 8px 32px #0003}.import-modal-header{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid #eee}.import-modal-all-check{display:flex;align-items:center;gap:8px;cursor:pointer}.import-modal-all-check input[type=checkbox]{width:16px;height:16px;cursor:pointer;accent-color:#1a73e8}.import-modal-title{font-size:14px;font-weight:600;margin:0;color:#222}.import-modal-close{background:none;border:none;font-size:18px;cursor:pointer;color:#888;line-height:1;padding:4px}.import-modal-close:hover{color:#333}.import-modal-list{list-style:none;margin:0;padding:6px 0;overflow-y:auto;flex:1}.import-modal-item{display:flex;align-items:center;gap:10px;padding:7px 20px;cursor:pointer;transition:background .12s}.import-modal-item:hover{background:#f5f5f5}.import-modal-item.checked{background:#edf3ff}.import-modal-item.duplicate{opacity:.5}.import-modal-item.duplicate .import-modal-item-title{text-decoration:line-through;color:#999}.import-modal-dup-badge{flex-shrink:0;font-size:11px;font-weight:600;color:#e06c00;background:#fff3e0;border:1px solid #ffcc80;border-radius:4px;padding:2px 6px;white-space:nowrap}.import-modal-dup-summary{color:#e06c00;font-size:13px;font-weight:500}.import-modal-checkbox{width:16px;height:16px;flex-shrink:0;cursor:pointer;accent-color:#1a73e8}.import-modal-thumb{width:52px;height:38px;object-fit:cover;border-radius:4px;flex-shrink:0}.import-modal-item-title{font-size:13px;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.import-modal-footer{display:flex;gap:8px;padding:12px 20px;border-top:1px solid #eee;justify-content:flex-end;flex-wrap:wrap}.import-modal-cancel{padding:8px 16px;border-radius:6px;border:1px solid #ccc;background:#fff;cursor:pointer;font-size:13px}.import-modal-cancel:hover{background:#f2f2f2}.import-modal-selected{padding:8px 16px;border-radius:6px;border:1px solid #1a73e8;background:#fff;color:#1a73e8;cursor:pointer;font-size:13px;font-weight:600}.import-modal-selected:hover:not(:disabled){background:#e8f0fe}.import-modal-selected:disabled{opacity:.4;cursor:not-allowed;border-color:#ccc;color:#999}.import-modal-confirm{padding:8px 16px;border-radius:6px;border:none;background:#1a73e8;color:#fff;cursor:pointer;font-size:13px;font-weight:600}.import-modal-confirm:hover{background:#1557b0}#Playlist{border-radius:20px;width:1200px;height:80vh;margin:0 auto;box-sizing:border-box;padding:0}#Playlist .playlist-title{margin:20px 0;display:flex;font-size:2rem;font-weight:700;justify-content:space-between;align-items:center}#Playlist .playlist-title .playlist-title-left .title-view{display:flex}#Playlist .playlist-title .playlist-title-left .title-view .title-text{margin-right:12px;line-height:1;max-width:820px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#Playlist .playlist-title .playlist-title-left .title-view .title-edit-btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:6px;background:transparent;border:none;color:#374151;cursor:pointer;padding:4px;transition:background-color .12s ease,color .12s ease}#Playlist .playlist-title .playlist-title-left .title-view .title-edit-btn:hover{background:#3741510f}#Playlist .playlist-title .playlist-title-left .title-view .title-actions{display:flex;align-items:center;gap:8px}#Playlist .playlist-title .playlist-title-left .title-view .title-play-all-btn{display:inline-flex;align-items:center;gap:8px;background:#1db954;color:#fff;border:none;padding:8px 16px;border-radius:999px;font-weight:600;cursor:pointer;transition:background-color .12s ease,transform .12s ease}#Playlist .playlist-title .playlist-title-left .title-view .title-play-all-btn:hover{background:#1ed760;transform:scale(1.05)}#Playlist .playlist-title .playlist-title-left .title-edit{display:flex;align-items:center;gap:8px;margin-left:12px}#Playlist .playlist-title .playlist-title-left .title-edit .title-edit-input{font-size:1.25rem;padding:6px 10px;border-radius:8px;border:1px solid rgba(15,23,42,.08);background:#fff;outline:none;min-width:380px}#Playlist .playlist-title .playlist-title-left .title-edit .title-edit-btns{display:inline-flex;gap:8px}#Playlist .playlist-title .playlist-title-left .title-edit .title-edit-btns button{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:6px;border:none;cursor:pointer;background:transparent;color:#374151}#Playlist .playlist-title .playlist-title-left .title-edit .title-edit-btns .title-confirm-btn{background:#10b981;color:#fff}#Playlist .playlist-title .playlist-title-left .title-edit .title-edit-btns .title-cancel-btn{background:#e53935;color:#fff}#Playlist .playlist-title .playlist-title-right{display:flex;align-items:center}#Playlist .playlist-title .playlist-title-right .goto-blog-btn{box-sizing:content-box;display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:8px;background:transparent;color:#0f172a;text-decoration:none;font-weight:600;transition:background-color .12s ease,color .12s ease,transform .12s ease,box-shadow .12s ease;font-size:16px}#Playlist .playlist-title .playlist-title-right .goto-blog-btn:hover{background:#0f172a0a;color:#0b1220;transform:translateY(-2px)}#Playlist .playlist-title .playlist-title-right .goto-blog-btn:active{transform:translateY(0)}#Playlist .playlist-title .playlist-title-right .goto-blog-btn:focus{outline:none}#Playlist .playlist-contents{height:60vh;overflow-y:auto;width:100%}#Playlist .playlist-contents .layout{width:100%;display:flex;flex-direction:column;align-items:center}#Playlist .playlist-contents .react-grid-layout{position:relative}#Playlist .playlist-input{margin-top:24px}#Playlist .playlist-input .playlist-form{display:flex;flex-direction:column;gap:8px}#Playlist .playlist-input .playlist-form .input-pill{display:flex;align-items:center;background:#fff;border-radius:999px;padding:8px 10px;box-shadow:0 2px 6px #0000000f;transition:box-shadow .16s ease,transform .12s ease,background-color .12s ease}#Playlist .playlist-input .playlist-form .input-pill:hover{box-shadow:0 8px 24px #10182814}#Playlist .playlist-input .playlist-form .input-pill:focus-within{transform:translateY(-2px);box-shadow:0 12px 36px #1018281f}#Playlist .playlist-input .playlist-form .input-pill .thumb-preview{width:48px;height:48px;border-radius:6px;object-fit:cover;margin-right:12px;transition:transform .14s ease}#Playlist .playlist-input .playlist-form .input-pill .thumb-placeholder{width:48px;height:48px;border-radius:6px;margin-right:12px}#Playlist .playlist-input .playlist-form .input-pill .link-input{flex:1;border:none;outline:none;font-size:1rem;background:transparent;transition:color .12s ease,background-color .12s ease}#Playlist .playlist-input .playlist-form .input-pill .link-input:focus{color:#0f172a}#Playlist .playlist-input .playlist-form .input-pill .add-btn{background:#1db954;border:none;width:44px;height:44px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;margin-left:12px;cursor:pointer;color:#fff;transition:transform .12s ease,box-shadow .12s ease,background-color .12s ease}#Playlist .playlist-input .playlist-form .input-pill .add-btn:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 8px 20px #1db95429}#Playlist .playlist-input .playlist-form .input-pill .add-btn:active{transform:translateY(0) scale(.99);box-shadow:none}#Playlist .playlist-input .playlist-form .meta-row{display:flex;justify-content:space-between;align-items:center;padding-left:70px}#Playlist .playlist-input .playlist-form .meta-row .song-title{font-weight:600}#Playlist .playlist-input .playlist-form .meta-row .hint{color:#888}#Playlist .playlist-input .playlist-form .meta-row .error{color:#e74c3c}#Playlist .playlist-input .playlist-form .meta-row .loading{color:#888}.playlist-loading-overlay{position:fixed;inset:0;background:#00000073;display:flex;align-items:center;justify-content:center;z-index:99999}.playlist-loading-box{background:#fff;border-radius:16px;padding:36px 48px;display:flex;flex-direction:column;align-items:center;gap:18px;box-shadow:0 8px 32px #0000002e;min-width:200px}.playlist-loading-spinner{width:40px;height:40px;border:4px solid #e5e7eb;border-top-color:#1a73e8;border-radius:50%;animation:playlist-spin .75s linear infinite}@keyframes playlist-spin{to{transform:rotate(360deg)}}.playlist-loading-msg{font-size:14px;font-weight:600;color:#374151;white-space:nowrap}.blog-area{flex:1}.blog-area .react-grid-layout{position:relative;transition:height .2s ease;background-color:color-mix(in srgb,var(--theme-color) 25%,white);margin:0 auto;min-height:550px;border-radius:15px;overflow:hidden}.blog-area .react-grid-layout .react-grid-item{transition:all .2s ease;background-color:#fefefe;transition-property:left,top,width,height;border-radius:10px;overflow:hidden;box-shadow:5px 5px 6px #0003}.blog-area .react-grid-layout .react-grid-item a{display:block;width:100%;height:100%}.blog-area .react-grid-layout .react-grid-item img{pointer-events:none;-webkit-user-select:none;user-select:none}.blog-area .react-grid-layout .react-grid-item.cssTransforms{transition-property:transform,width,height}.blog-area .react-grid-layout .react-grid-item.resizing{transition:none;z-index:1;will-change:width,height}.blog-area .react-grid-layout .react-grid-item.react-draggable-dragging{transition:none;z-index:3;will-change:transform}.blog-area .react-grid-layout .react-grid-item.dropping{visibility:hidden}.blog-area .react-grid-layout .react-grid-item.react-grid-placeholder{border:3px dashed #c80cf7;opacity:.2;transition-duration:.1s;z-index:2;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none}.blog-area .react-grid-layout .react-grid-item.react-grid-placeholder.placeholder-resizing{transition:none}.blog-area .react-grid-layout .react-grid-item>.react-resizable-handle{position:absolute;width:20px;height:20px}.blog-area .react-grid-layout .react-grid-item>.react-resizable-handle:after{content:"";position:absolute;right:6px;bottom:6px;width:5px;height:5px;border-right:2px solid rgba(0,0,0,.4);border-bottom:2px solid rgba(0,0,0,.4)}.blog-area .react-grid-layout .react-grid-item>.react-resizable-handle.react-resizable-handle-sw{bottom:0;left:0;cursor:sw-resize;transform:rotate(90deg)}.blog-area .react-grid-layout .react-grid-item>.react-resizable-handle.react-resizable-handle-se{bottom:0;right:0;cursor:se-resize}.blog-area .react-grid-layout .react-grid-item>.react-resizable-handle.react-resizable-handle-nw{top:0;left:0;cursor:nw-resize;transform:rotate(180deg)}.blog-area .react-grid-layout .react-grid-item>.react-resizable-handle.react-resizable-handle-ne{top:0;right:0;cursor:ne-resize;transform:rotate(270deg)}.blog-area .react-grid-layout .react-grid-item>.react-resizable-handle.react-resizable-handle-w,.blog-area .react-grid-layout .react-grid-item>.react-resizable-handle.react-resizable-handle-e{top:50%;margin-top:-10px;cursor:ew-resize}.blog-area .react-grid-layout .react-grid-item>.react-resizable-handle.react-resizable-handle-w{left:0;transform:rotate(135deg)}.blog-area .react-grid-layout .react-grid-item>.react-resizable-handle.react-resizable-handle-e{right:0;transform:rotate(315deg)}.blog-area .react-grid-layout .react-grid-item>.react-resizable-handle.react-resizable-handle-n,.blog-area .react-grid-layout .react-grid-item>.react-resizable-handle.react-resizable-handle-s{left:50%;margin-left:-10px;cursor:ns-resize}.blog-area .react-grid-layout .react-grid-item>.react-resizable-handle.react-resizable-handle-n{top:0;transform:rotate(225deg)}.blog-area .react-grid-layout .react-grid-item>.react-resizable-handle.react-resizable-handle-s{bottom:0;transform:rotate(45deg)}.blog-area .react-grid-layout .react-grid-item>div{display:flex;flex-direction:column;width:100%;height:100%;cursor:default}.blog-area .react-grid-layout .react-grid-item>div[class^=image-]{cursor:pointer}.blog-area .react-grid-layout .react-grid-item>div.is-editting .grid-item-top .grid-item-text{cursor:grab}.blog-area .react-grid-layout .react-grid-item>div.is-editting .grid-title-content,.blog-area .react-grid-layout .react-grid-item>div.is-editting .grid-post-content,.blog-area .react-grid-layout .react-grid-item>div.is-editting .grid-link-content,.blog-area .react-grid-layout .react-grid-item>div.is-editting .grid-image-content,.blog-area .react-grid-layout .react-grid-item>div.is-editting .grid-map-content{cursor:pointer}.blog-area .react-grid-layout .react-grid-item>div .grid-item-top{display:flex;justify-content:space-between;align-items:center;background-color:var(--theme-color);padding:2px 10px;height:32px;flex-shrink:0;overflow:hidden}.blog-area .react-grid-layout .react-grid-item>div .grid-item-top .grid-item-text{display:flex;align-items:center;flex:1;height:100%;padding:4px;min-width:0}.blog-area .react-grid-layout .react-grid-item>div .grid-item-top .grid-item-text img{width:17px;height:17px;flex-shrink:0;margin-right:6px;filter:var(--icon-filter)}.blog-area .react-grid-layout .react-grid-item>div .grid-item-top .grid-item-text p{margin:0;font-size:13px;font-weight:700;color:var(--theme-text-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}.blog-area .react-grid-layout .react-grid-item>div .grid-item-top .grid-item-delete{width:25px;height:25px;padding:3px;cursor:pointer;flex-shrink:0}.blog-area .react-grid-layout .react-grid-item>div .grid-item-top .grid-item-delete:after{content:"";display:block;width:13px;height:13px;margin-left:5px;border-radius:50%;background-color:#c2c2c2;transition:.2s}.blog-area .react-grid-layout .react-grid-item>div .grid-item-top .grid-item-delete:hover:after{background-color:red;opacity:.7}.blog-area .react-grid-layout .react-grid-item>div .grid-title-content{flex:1;align-content:center;padding:0 20px;font-size:22px;font-weight:700}.blog-area .react-grid-layout .react-grid-item>div .grid-image-content{width:100%;height:100%;overflow:hidden}.blog-area .react-grid-layout .react-grid-item>div .grid-image-content img{width:100%;height:100%;object-fit:cover}.blog-area .react-grid-layout .react-grid-item>div .grid-link-content{width:100%;height:100%}.blog-area .react-grid-layout .react-grid-item>div .grid-link-content .link-preview{display:flex;width:100%;height:100%;overflow:hidden}.blog-area .react-grid-layout .react-grid-item>div .grid-link-content .link-preview img{width:100%;height:100%;object-fit:cover;display:block}.blog-area .react-grid-layout .react-grid-item>div .grid-link-content .link-no-thumb{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:16px;gap:8px}.blog-area .react-grid-layout .react-grid-item>div .grid-link-content .link-no-thumb .no-thumb-text{font-size:14px;color:#999}.blog-area .react-grid-layout .react-grid-item>div .grid-link-content .link-no-thumb .link-title{font-size:16px;font-weight:700;color:#111}.blog-area .react-grid-layout .react-grid-item>div .grid-link-content .link-no-thumb .link-url{font-size:14px;color:#555;word-break:break-all}.blog-area .react-grid-layout .react-grid-item>div .grid-post-content{width:100%;height:100%}.blog-area .react-grid-layout .react-grid-item>div .grid-post-content .post-preview{display:block;width:100%;height:100%;overflow:hidden;text-decoration:none;color:inherit}.blog-area .react-grid-layout .react-grid-item>div .grid-post-content .layout-title_only{display:flex;align-items:center}.blog-area .react-grid-layout .react-grid-item>div .grid-post-content .layout-title_only p{padding:0 20px;font-size:16px;font-weight:700;line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.blog-area .react-grid-layout .react-grid-item>div .grid-post-content .layout-image_only .post-thumbnail{width:100%;height:100%;object-fit:cover;display:block}.blog-area .react-grid-layout .react-grid-item>div .grid-post-content .layout-vertical_card{display:flex;flex-direction:column;height:100%}.blog-area .react-grid-layout .react-grid-item>div .grid-post-content .layout-vertical_card .post-vertical-card{display:flex;flex-direction:column;height:100%}.blog-area .react-grid-layout .react-grid-item>div .grid-post-content .layout-vertical_card .post-thumbnail{flex:10;width:100%;object-fit:cover;display:block}.blog-area .react-grid-layout .react-grid-item>div .grid-post-content .layout-vertical_card .text{flex:.8;padding:12px 16px;display:flex;flex-direction:column;justify-content:center;overflow:hidden}.blog-area .react-grid-layout .react-grid-item>div .grid-post-content .layout-vertical_card .text .title{font-size:14px;font-weight:700;color:#111;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.blog-area .react-grid-layout .react-grid-item>div .grid-post-content .layout-horizontal_card{height:100%}.blog-area .react-grid-layout .react-grid-item>div .grid-post-content .layout-horizontal_card .post-horizontal-inner{display:flex;height:100%;width:100%;gap:12px}.blog-area .react-grid-layout .react-grid-item>div .grid-post-content .layout-horizontal_card .post-thumbnail{height:100%;aspect-ratio:1/1;object-fit:cover;flex-shrink:0;display:block}.blog-area .react-grid-layout .react-grid-item>div .grid-post-content .layout-horizontal_card .text{flex:1;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:6px 0;overflow:hidden}.blog-area .react-grid-layout .react-grid-item>div .grid-post-content .layout-horizontal_card .text .title{flex:1;font-size:16px;font-weight:700;color:#111;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.blog-area .react-grid-layout .react-grid-item>div .grid-post-content .layout-horizontal_card .text .content{flex:5;font-size:14px;color:#555;line-height:1.4;overflow:hidden;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical}.blog-area .react-grid-layout .react-grid-item>div .grid-map-content{width:100%;height:100%;overflow:hidden;position:relative;border-radius:inherit}.blog-area .react-grid-layout .react-grid-item>div .grid-post-content,.blog-area .react-grid-layout .react-grid-item>div .grid-link-content,.blog-area .react-grid-layout .react-grid-item>div .grid-image-content,.blog-area .react-grid-layout .react-grid-item>div .grid-map-content{flex:1;min-height:0;align-content:center;font-weight:700}.blog-area .react-grid-layout .react-grid-item>div .grid-post-content .default-text,.blog-area .react-grid-layout .react-grid-item>div .grid-link-content .default-text,.blog-area .react-grid-layout .react-grid-item>div .grid-image-content .default-text,.blog-area .react-grid-layout .react-grid-item>div .grid-map-content .default-text{padding:0 20px}.blog-post-wrapper{width:100%;padding-top:20px;background-color:#f3f3f3;border-radius:16px;box-sizing:border-box}.blog-post-wrapper .blog-post-search-area{padding:0 30px;width:100%;box-sizing:border-box}.blog-post-wrapper .blog-post-search-area .post-search-input{width:100%;height:50px;border-radius:12px;padding:0 14px;font-size:18px;border:1px solid #cbcbcb;box-sizing:border-box;outline:none}.blog-post-wrapper .blog-post-search-area .post-search-input:focus{border-color:#a1a1a1}.blog-post-wrapper .blog-posts-area{display:flex;flex-wrap:wrap;width:100%;gap:16px;padding:23px;box-sizing:border-box}.blog-post-wrapper .blog-posts-area .blog-post-item{width:200px;height:200px;border-radius:16px;border:1px solid #cbcbcb;overflow:hidden;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}.blog-post-wrapper .blog-posts-area .blog-post-item:hover{transform:translateY(-4px);box-shadow:0 10px 15px #e3e3e3}.blog-post-wrapper .blog-posts-area .blog-post-item .blog-post-thumbnail{width:100%;height:140px;object-fit:cover;background-color:#fff;display:block}.blog-post-wrapper .blog-posts-area .blog-post-item .blog-post-title{width:100%;height:60px;padding:8px;background-color:#fff;border-top:1px solid #cbcbcb;box-sizing:border-box}.blog-post-wrapper .blog-posts-area .blog-post-item .blog-post-title p{margin:0;display:-webkit-box;color:#121212;font-size:14px;font-weight:600;line-height:1.4em;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;text-overflow:ellipsis}.blog-post-wrapper .blog-posts-area .blog-post-sentinel{flex-basis:100%;display:flex;justify-content:center;align-items:center;padding:20px 0;color:#888;font-size:14px}.blog-post-wrapper .blog-posts-area .blog-post-sentinel p{margin:0}.blog-post-wrapper .blog-posts-area .blog-post-empty{width:100%;text-align:center}.blog-post-wrapper .blog-posts-area .blog-post-empty img{width:100%;max-width:400px;object-fit:contain}.BlogPlaylistItem{background:#fff;border:1px solid #ddd;border-radius:12px;box-shadow:0 6px 18px #0a0a0a0f;overflow:hidden;display:flex;flex-direction:row;transition:transform .18s ease,box-shadow .18s ease}.BlogPlaylistItem .playlist-link{color:inherit;text-decoration:none;display:block;height:100%;width:100%}.BlogPlaylistItem .playlist-link .playlist-thumb{height:120px;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#fafafa,#f2f2f2);border-bottom:1px solid #eee;font-size:14px;color:#666;box-sizing:border-box;overflow:hidden;line-height:0}.BlogPlaylistItem .playlist-link .playlist-thumb img{width:100%;height:100%;display:block;object-fit:cover;object-position:center;transition:opacity .16s ease;opacity:1}.BlogPlaylistItem .playlist-link .playlist-thumb .img-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#999;font-size:13px}.BlogPlaylistItem .playlist-link .playlist-body{padding:12px 14px;display:flex;flex-direction:column;justify-content:space-between}.BlogPlaylistItem .playlist-link .playlist-body .playlist-title{font-size:16px;margin:0 0 8px;line-height:1.25;color:#111;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.BlogPlaylistItem .playlist-item-buttons{display:flex;gap:8px;margin-top:12px;align-items:center;justify-content:flex-start;padding:0 14px 12px}.BlogPlaylistItem .playlist-item-buttons .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:6px 10px;border-radius:10px;border:1px solid transparent;background:#0000000a;color:#333;font-size:13px;cursor:pointer;transition:transform .16s ease,background .16s ease,color .16s ease,border-color .16s ease;-webkit-user-select:none;user-select:none;line-height:1}.BlogPlaylistItem .playlist-item-buttons .btn:focus{outline:3px solid rgba(31,78,255,.12);outline-offset:2px}.BlogPlaylistItem .playlist-item-buttons .btn.icon-only{padding:6px;width:36px;height:36px;border-radius:9px}.BlogPlaylistItem .playlist-item-buttons .btn.play{background:#1f4eff0f;color:#1f4eff;border-color:#1f4eff1f}.BlogPlaylistItem .playlist-item-buttons .btn.play:hover{transform:translateY(-3px);background:#1f4eff1f;box-shadow:0 6px 18px #1f4eff0f}.BlogPlaylistItem .playlist-item-buttons .btn.delete{background:#ff32320a;color:#d32f2f;border-color:#db443714}.BlogPlaylistItem .playlist-item-buttons .btn.delete:hover{transform:translateY(-3px);background:#ff32321f;box-shadow:0 6px 18px #db44370f}.BlogPlaylistItem .playlist-item-buttons .btn.label{padding:6px 12px;border-radius:8px;background:#00000008}.BlogPlaylistItem .playlist-item-buttons .btn svg{width:20px;height:20px;display:block;vertical-align:middle;fill:currentColor}.BlogPlaylistItem .playlist-item-buttons .btn img{width:20px;height:20px;display:block;object-fit:contain;filter:brightness(0) saturate(100%)}@media(max-width:640px){.BlogPlaylistItem .playlist-item-buttons{gap:6px}.BlogPlaylistItem .playlist-item-buttons .btn{font-size:12px;padding:6px 8px}.BlogPlaylistItem .playlist-item-buttons .btn.icon-only{width:34px;height:34px}}#BlogPlaylist{display:flex;flex-direction:column;gap:5px}#BlogPlaylist .blog-playlist-new{width:100%;height:120px;display:flex;align-items:center;justify-content:center;border:2px dashed #ccc;border-radius:20px;transition:all .3s ease}#BlogPlaylist .blog-playlist-new:hover{border-color:#121212;background-color:#f9f9f9;color:#121212;cursor:pointer}#BlogPlaylist .blog-playlist-new button{width:100%;height:100%;display:block;font-size:40px;color:inherit;transition:all .3s ease;color:#ccc}.blog-playlist-new:hover #BlogPlaylist .blog-playlist-new button,#BlogPlaylist .blog-playlist-new button:hover,#BlogPlaylist .blog-playlist-new button:focus{color:#121212;outline:none}#BlogPlaylist .noBlogPlaylist{display:flex;align-items:center;justify-content:center}.pac-container{z-index:10000!important;border-radius:8px;border-top:none;box-shadow:0 4px 20px #0003;margin-top:5px;background-color:#fff;font-family:inherit}.pac-container .pac-item{padding:8px 12px;cursor:pointer}.pac-container .pac-item:hover{background-color:#f8f9fa}.modal-overlay{display:flex;justify-content:center;align-items:center;position:fixed;inset:0;background-color:#000000b3;z-index:1500;animation:fade-in .2s ease-out}.modal-overlay #BlogElementModal{width:700px;height:300px;text-align:center;border-radius:20px;background-color:#fff;z-index:1600;display:flex;flex-direction:column;overflow:hidden;animation:slide-up .3s ease-out}.modal-overlay #BlogElementModal.is-post-modal,.modal-overlay #BlogElementModal.is-image-modal{height:500px}.modal-overlay #BlogElementModal.is-map-modal{height:600px}.modal-overlay #BlogElementModal .modal-top{display:flex;height:46px;justify-content:space-between;align-items:center;padding:8px 20px;background-color:#dbdce0}.modal-overlay #BlogElementModal .modal-top .modal-icon{width:30px;height:30px}.modal-overlay #BlogElementModal .modal-top .close-modal-btn{display:flex;justify-content:center;align-items:center;width:30px;height:30px;text-indent:-999999px}.modal-overlay #BlogElementModal .modal-top .close-modal-btn:after{display:block;content:"";width:15px;height:15px;border-radius:50%;text-indent:0;background-color:red}.modal-overlay #BlogElementModal .modal-top .close-modal-btn:hover:after{content:"x";color:#fff;font-size:15px;line-height:13px;background-color:#cd0000}.modal-overlay #BlogElementModal .modal-inner{flex:1;display:flex;flex-direction:column;gap:16px;padding:16px;overflow:hidden}.modal-overlay #BlogElementModal .modal-inner .post-search-input{height:48px;font-size:18px;padding:0 18px;border-radius:18px}.modal-overlay #BlogElementModal .modal-inner h1{font-size:18px;font-weight:700;color:#121212}.modal-overlay #BlogElementModal .modal-inner .post-list-area{flex:1;display:flex;flex-direction:column;gap:12px;padding-right:6px;overflow-y:auto}.modal-overlay #BlogElementModal .modal-inner .post-list-area::-webkit-scrollbar{width:6px}.modal-overlay #BlogElementModal .modal-inner .post-list-area::-webkit-scrollbar-thumb{background-color:#cfcfcf;border-radius:4px}.modal-overlay #BlogElementModal .modal-inner .post-list-item{display:flex;gap:14px;padding:14px;border-radius:12px;border:1px solid #e1e1e1;background-color:#fafafa;cursor:pointer;text-align:left;transition:all .15s ease}.modal-overlay #BlogElementModal .modal-inner .post-list-item:hover{background-color:#f1f1f1}.modal-overlay #BlogElementModal .modal-inner .post-list-item.selected-post{border-color:#9ee7e7;background-color:#9ee7e740;box-shadow:0 0 0 1px #9ee7e799}.modal-overlay #BlogElementModal .modal-inner .post-list-item .post-thumbnail{width:100px;aspect-ratio:1/1;border-radius:12px;overflow:hidden;flex-shrink:0;background-color:#eaeaea;border:1px solid #ddd}.modal-overlay #BlogElementModal .modal-inner .post-list-item .post-thumbnail img{width:100%;height:100%;object-fit:cover;display:block}.modal-overlay #BlogElementModal .modal-inner .post-list-item .post-info{flex:1;display:flex;flex-direction:column;justify-content:center;min-width:0}.modal-overlay #BlogElementModal .modal-inner .post-list-item .post-title{font-size:16px;font-weight:700;color:#121212;margin-bottom:6px;line-height:1.4}.modal-overlay #BlogElementModal .modal-inner .post-list-item .post-content{font-size:14px;color:#555;line-height:1.5;margin-bottom:6px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.modal-overlay #BlogElementModal .modal-inner .post-list-item .post-content .post-more{display:none}.modal-overlay #BlogElementModal .modal-inner .post-list-item .post-date{display:block;font-size:12px;color:#999;text-align:right}.modal-overlay #BlogElementModal .modal-inner .post-empty{height:200px;display:flex;align-items:center;justify-content:center;color:#999;font-size:14px}.modal-overlay #BlogElementModal .modal-inner .post-loading{height:200px;display:flex;align-items:center;justify-content:center}.modal-overlay #BlogElementModal .modal-inner .post-loading .post-loading-animation{width:50px;height:50px;border:6px solid #f3f3f3;border-top:6px solid #3498db;border-radius:50%;animation:spin 1s linear infinite}.modal-overlay #BlogElementModal .modal-inner .post-end{text-align:center;padding:16px 0;font-size:13px;color:#999}.modal-overlay #BlogElementModal .modal-inner .sentinel{flex-shrink:0}.modal-overlay #BlogElementModal .modal-inner .image-modal-area{display:flex;justify-content:center;margin-top:20px;height:300px}.modal-overlay #BlogElementModal .modal-inner .image-modal-area .image-drop-zone{flex:1;border:2px dashed #bbb;border-radius:16px;display:flex;justify-content:center;align-items:center;cursor:pointer;transition:all .2s ease;position:relative;overflow:hidden;background-color:#fafafa}.modal-overlay #BlogElementModal .modal-inner .image-modal-area .image-drop-zone.dragging{border-color:#111;background-color:#f0f0f0}.modal-overlay #BlogElementModal .modal-inner .image-modal-area .image-drop-zone .placeholder{text-align:center;color:#888;font-size:16px}.modal-overlay #BlogElementModal .modal-inner .image-modal-area .image-drop-zone .image-preview{width:100%;height:100%;display:flex;justify-content:center;align-items:center}.modal-overlay #BlogElementModal .modal-inner .image-modal-area .image-drop-zone .image-preview img{max-width:100%;max-height:100%;object-fit:contain}.modal-overlay #BlogElementModal .modal-inner .modal-content-area input{width:60%;height:40px;padding:0 10px;font-size:18px;border-radius:5px}.modal-overlay #BlogElementModal .modal-inner .modal-content-area .empty-content-alert{transform:translate(-20%);color:#d80000}.modal-overlay #BlogElementModal .modal-inner .modal-btn-area{display:flex;justify-content:center;gap:20px}.modal-overlay #BlogElementModal .modal-inner .modal-btn-area button{width:100px;height:40px;border-radius:8px;font-size:18px;color:#fff;background-color:#585858}.modal-overlay #BlogElementModal .modal-inner .modal-btn-area .btn-cancel{color:#121212;border:1px solid #585858;background-color:#fff}.modal-overlay .blog-image-modal{height:calc(100vh - 100px);animation:slide-up .3s ease-out}.modal-overlay .blog-image-modal img{height:100%;object-fit:contain}#Blog{position:relative;padding:60px 0;--theme-color: #9ee7e7;--theme-text-color: #333}#Blog .blog-wrapper{position:relative;display:flex;gap:10px}#Blog .blog-wrapper .user-info-area{position:sticky;top:60px;left:0;display:flex;flex-direction:column;align-items:center;height:550px;gap:20px;flex:.3;padding:10px;background:#fff;border-radius:20px;box-shadow:0 10px 30px #0000000d}#Blog .blog-wrapper .user-info-area .profile-photo-wrapper{flex:1}#Blog .blog-wrapper .user-info-area .profile-photo-wrapper .profile-photo{width:250px;height:250px;border:1px solid #cccccc;border-radius:50%;overflow:hidden;text-align:center;align-content:center}#Blog .blog-wrapper .user-info-area .profile-photo-wrapper .profile-photo #user-profile-photo{width:100%;height:100%;object-fit:cover}#Blog .blog-wrapper .user-info-area .edit-profile-photo{position:absolute;top:180px;right:20px;width:50px;height:50px;padding:5px;border-radius:15px;border:2px solid #cccccc;background-color:#fff;object-fit:contain}#Blog .blog-wrapper .user-info-area .edit-profile-photo:hover{background-color:#ccc}#Blog .blog-wrapper .user-info-area .edit-profile-photo img{width:100%}#Blog .blog-wrapper .user-info-area .user-introduction{flex:1;width:100%}#Blog .blog-wrapper .user-info-area .user-introduction.is-editting{flex:.7}#Blog .blog-wrapper .user-info-area .user-introduction.is-editting textarea{cursor:Text}#Blog .blog-wrapper .user-info-area .user-introduction.is-editting textarea:focus{border-color:transparent;outline:3px solid color-mix(in srgb,var(--theme-color) 50%,white)}#Blog .blog-wrapper .user-info-area .user-introduction.is-my-blog{flex:.8}#Blog .blog-wrapper .user-info-area .user-introduction textarea{font-family:Pretendard Variable,Pretendard,sans-serif;width:100%;height:100%;resize:none;padding:20px;font-size:18px;border-radius:15px;cursor:default}#Blog .blog-wrapper .user-info-area .user-introduction textarea:focus{outline:none}#Blog .blog-wrapper .user-info-area .user-nickname-wrapper{width:100%;display:flex;flex-direction:column;align-items:center;gap:8px}#Blog .blog-wrapper .user-info-area .user-nickname-wrapper .user-nickname{font-size:24px;font-weight:800;color:#333}#Blog .blog-wrapper .user-info-area .user-nickname-wrapper .nickname-input-group{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:5px}#Blog .blog-wrapper .user-info-area .user-nickname-wrapper .nickname-input-group .edit-nickname-input{padding:8px 12px;font-size:16px;border:1px solid #ccc;border-radius:8px;outline:none;width:180px}#Blog .blog-wrapper .user-info-area .user-nickname-wrapper .nickname-input-group .edit-nickname-input:focus{border-color:transparent;outline:3px solid color-mix(in srgb,var(--theme-color) 50%,white)}#Blog .blog-wrapper .user-info-area .user-nickname-wrapper .nickname-input-group .check-nickname-btn{padding:8px 12px;height:38px;font-size:14px;font-weight:700;color:#fff;background-color:#555;border:none;border-radius:8px;cursor:pointer;white-space:nowrap}#Blog .blog-wrapper .user-info-area .user-nickname-wrapper .nickname-input-group .check-nickname-btn:hover:not(:disabled){background-color:#333}#Blog .blog-wrapper .user-info-area .user-nickname-wrapper .nickname-input-group .check-nickname-btn:disabled{background-color:#ccc;cursor:not-allowed}#Blog .blog-wrapper .user-info-area .user-nickname-wrapper .nickname-message{font-size:13px;margin-top:4px}#Blog .blog-wrapper .user-info-area .user-nickname-wrapper .nickname-message.success{color:#00b894}#Blog .blog-wrapper .user-info-area .user-nickname-wrapper .nickname-message.error{color:#d63031}#Blog .blog-wrapper .user-info-area .user-info-btns{flex:.3;display:flex;justify-content:center;gap:24px}#Blog .blog-wrapper .user-info-area .user-info-btns button{width:80px;height:50px;border-radius:10px;font-size:16px;color:#121212;font-weight:700}#Blog .blog-wrapper .user-info-area .user-info-btns .save-btn{color:var(--theme-text-color);background-color:var(--theme-color);transition:.2s}#Blog .blog-wrapper .user-info-area .user-info-btns .save-btn:hover{background-color:color-mix(in srgb,var(--theme-color) 80%,black)}#Blog .blog-wrapper .user-info-area .user-info-btns .cancel-btn{border:2px solid var(--theme-color);background-color:#fff;transition:.2s}#Blog .blog-wrapper .user-info-area .user-info-btns .cancel-btn:hover{background-color:color-mix(in srgb,var(--theme-color) 15%,white)}#Blog .blog-wrapper .user-info-area .edit-btn{flex:.2;width:95%;color:var(--theme-text-color);background-color:var(--theme-color);border-radius:10px;font-weight:700;letter-spacing:3px;transition:.2s}#Blog .blog-wrapper .user-info-area .edit-btn:hover{background-color:color-mix(in srgb,var(--theme-color) 80%,black);transform:scale(1.05)}#Blog .blog-wrapper .blog-wrapper-area{position:relative;display:flex;flex-direction:column;flex:1;width:100%}#Blog .blog-wrapper .blog-wrapper-area .blog-wrapper-tab{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}#Blog .blog-wrapper .blog-wrapper-area .blog-wrapper-tab .tab-left{display:flex;align-items:center;border-radius:8px;box-shadow:0 6px 18px #0a0a0a0f}#Blog .blog-wrapper .blog-wrapper-area .blog-wrapper-tab .tab-left .theme-btn{width:48px;height:48px;border-radius:50%;border:none;cursor:pointer;color:#fff;transition:.2s}#Blog .blog-wrapper .blog-wrapper-area .blog-wrapper-tab .tab-left .theme-btn:hover{transform:scale(1.1)}#Blog .blog-wrapper .blog-wrapper-area .blog-wrapper-tab .tab-left .theme-btn img{width:100%;height:100%}#Blog .blog-wrapper .blog-wrapper-area .blog-wrapper-tab .tab-right{z-index:950;display:flex;gap:8px;align-items:center;padding:6px;justify-content:right;background:#fffffff2;box-shadow:0 6px 18px #0a0a0a0f;border:1px solid #ececec;border-radius:999px}#Blog .blog-wrapper .blog-wrapper-area .blog-wrapper-tab .tab-right button{border:none;background:transparent;padding:6px;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;cursor:pointer;transition:background .15s ease,transform .12s ease,box-shadow .15s ease}#Blog .blog-wrapper .blog-wrapper-area .blog-wrapper-tab .tab-right button img{width:18px;height:18px;display:block;filter:grayscale(80%) contrast(90%);opacity:.95}#Blog .blog-wrapper .blog-wrapper-area .blog-wrapper-tab .tab-right button:hover{background:#0000000a;transform:translateY(-2px)}#Blog .blog-wrapper .blog-wrapper-area .blog-wrapper-tab .tab-right button:hover:disabled{cursor:not-allowed;transform:none;background:transparent}#Blog .blog-wrapper .blog-wrapper-area .blog-wrapper-tab .tab-right button.active{background:#0078d4;box-shadow:0 6px 18px #0078d42e}#Blog .blog-wrapper .blog-wrapper-area .blog-wrapper-tab .tab-right button.active img{filter:none;opacity:1}#Blog .blog-wrapper .blog-wrapper-area .blog-wrapper-tab .tab-right button:focus{outline:2px solid rgba(0,120,212,.18);outline-offset:2px}@media(max-width:640px){#Blog .blog-wrapper .blog-wrapper-area .blog-wrapper-tab .tab-right{gap:6px}#Blog .blog-wrapper .blog-wrapper-area .blog-wrapper-tab .tab-right button{padding:8px;border-radius:12px}#Blog .blog-wrapper .blog-wrapper-area .blog-wrapper-tab .tab-right button .label{display:none}}#Blog .floating-droppables-ui{position:sticky;bottom:5%;left:50%;transform:translate(-50%);display:flex;justify-content:space-between;width:500px;height:70px;padding:10px 50px;border:2px dashed #b9b9b9;border-radius:35px;z-index:5;background-color:#fafafa;box-shadow:10px 10px 15px #9b9b9b}#Blog .floating-droppables-ui>div{position:relative;width:50px;height:50px;cursor:grab;text-align:center;border-radius:10px;background-color:var(--theme-color)}#Blog .floating-droppables-ui>div:hover{transform:scale(1.1);transition:.2ms}#Blog .floating-droppables-ui>div:hover i,#Blog .floating-droppables-ui>div:focus i{display:block}#Blog .floating-droppables-ui>div i{position:absolute;display:none;height:2.3em;width:8em;bottom:-2.8em;left:calc(-50% + 1.25em);padding:.5em;text-align:center;color:#fff;font-size:18px;background-color:#585858;box-sizing:border-box;transform:translate(-20%);border-radius:.4em}#Blog .floating-droppables-ui>div img{width:100%;padding:8px;object-fit:contain;filter:var(--icon-filter)}#Blog .floating-droppables-ui>div .link-element{padding:10px}#Blog .react-resizable-hide>.react-resizable-handle{display:none}#Blog .theme-modal-overlay{position:fixed;inset:0;z-index:2000;display:flex;justify-content:center;align-items:center;flex-direction:column;background:#00000073;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:fadeIn .2s ease}#Blog .theme-modal-overlay .modal-top{display:flex;width:320px;height:46px;justify-content:space-between;align-items:center;padding:8px 20px;background-color:#dbdce0;border-top-left-radius:20px;border-top-right-radius:20px;animation:scaleUp .2s ease}#Blog .theme-modal-overlay .modal-top img{width:28px;height:28px}#Blog .theme-modal-overlay .modal-top button{display:flex;justify-content:center;align-items:center;width:30px;height:30px;text-indent:-999999px}#Blog .theme-modal-overlay .modal-top button:after{display:block;content:"";width:15px;height:15px;border-radius:50%;text-indent:0;background-color:red}#Blog .theme-modal-overlay .modal-top button:hover:after{content:"x";color:#fff;font-size:15px;line-height:13px;background-color:#cd0000}#Blog .theme-modal-overlay .theme-modal{background:#fff;width:320px;padding:28px;border-bottom-left-radius:20px;border-bottom-right-radius:20px;box-shadow:0 20px 60px #00000040;display:flex;flex-direction:column;gap:20px;align-items:center;animation:scaleUp .2s ease}#Blog .theme-modal-overlay .theme-modal h3{font-size:20px;font-weight:700;color:#333}#Blog .theme-modal-overlay .theme-modal button{margin-top:10px;padding:8px 18px;border-radius:8px;border:none;cursor:pointer;font-weight:600;background:#121212;color:#fff;transition:.2s}#Blog .theme-modal-overlay .theme-modal button:hover{background:#333}#SignUp{display:flex;align-items:center;justify-content:center;padding:40px 16px}#SignUp .signup-container{width:360px;max-width:92vw;background:transparent;display:flex;flex-direction:column;align-items:center;gap:18px}#SignUp .signup-container .signup-title{font-size:28px;font-weight:600;margin-bottom:6px;text-align:center}#SignUp .signup-container .signup-form{width:100%;display:flex;flex-direction:column;gap:12px}#SignUp .signup-container .signup-form .form-row{display:flex;flex-direction:column;gap:8px}#SignUp .signup-container .signup-form .form-row .label-text{font-size:12px;font-weight:600;margin-left:6px}#SignUp .signup-container .signup-form .form-row .label-text .necessary{color:#e74c3c}#SignUp .signup-container .signup-form .form-row .input-field{width:100%;height:40px;padding:8px 12px;border-radius:14px;border:2px solid #222;outline:none;box-sizing:border-box;font-size:14px}#SignUp .signup-container .signup-form .form-row .check-button{height:40px;padding:0 16px;border-radius:14px;border:2px solid #222;background:#fff;color:#222;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;transition:all .2s}#SignUp .signup-container .signup-form .form-row .check-button:hover:not(:disabled){background:#222;color:#fff}#SignUp .signup-container .signup-form .form-row .check-button:disabled{opacity:.4;cursor:not-allowed;border-color:#ccc;color:#999}#SignUp .signup-container .signup-form .pw-rules{display:flex;flex-direction:column;gap:6px;margin-top:8px;padding-left:6px}#SignUp .signup-container .signup-form .pw-rules .pw-rule{display:flex;align-items:center;gap:8px;font-size:12px;color:#666}#SignUp .signup-container .signup-form .pw-rules .pw-rule .pw-rule-icon{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;font-size:12px}#SignUp .signup-container .signup-form .pw-rules .pw-rule.ok{color:#10b981}#SignUp .signup-container .signup-form .pw-rules .pw-rule.ok .pw-rule-icon{background:#d1fae5;color:#065f46}#SignUp .signup-container .signup-form .pw-rules .pw-rule.fail{color:#e74c3c}#SignUp .signup-container .signup-form .pw-rules .pw-rule.fail .pw-rule-icon{background:#fee2e2;color:#7f1d1d}#SignUp .signup-container .signup-form .form-actions{display:flex;justify-content:center;margin-top:8px}#SignUp .signup-container .signup-form .form-actions .submit-btn{background:#fff;border:2px solid #222;padding:10px 22px;border-radius:24px;cursor:pointer;font-size:14px;font-weight:600;transition:transform .14s ease,box-shadow .14s ease,background-color .16s ease,color .16s ease;box-shadow:0 6px 18px #0000000f}#SignUp .signup-container .signup-form .form-actions .submit-btn:hover:not([disabled]){transform:translateY(-3px) scale(1.02);box-shadow:0 14px 36px #0000001f;background:#222;color:#fff}#SignUp .signup-container .signup-form .form-actions .submit-btn[disabled],#SignUp .signup-container .signup-form .form-actions .submit-btn[aria-disabled=true]{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}#SignUp .signup-container .signup-form .field-error{color:#e74c3c;font-size:12px;margin-top:6px;margin-left:6px}#LogBookIntro{min-height:100vh;overflow-x:hidden;position:relative;background:linear-gradient(180deg,transparent 0%,#0c0c0c 20%,#1a1a2e 50%,#16213e 100%);color:#fff}#LogBookIntro .animated-bg{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;overflow:hidden}#LogBookIntro .animated-bg .stars,#LogBookIntro .animated-bg .twinkling,#LogBookIntro .animated-bg .clouds{position:absolute;inset:0;width:100%;height:100%;display:block}#LogBookIntro .animated-bg .stars{background:#000 url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="20" cy="20" r="1" fill="white" opacity="0.8"/><circle cx="80" cy="40" r="0.5" fill="white" opacity="0.6"/><circle cx="40" cy="80" r="1.5" fill="white" opacity="0.9"/><circle cx="90" cy="10" r="0.8" fill="white" opacity="0.7"/><circle cx="10" cy="90" r="1.2" fill="white" opacity="0.8"/><circle cx="60" cy="30" r="0.6" fill="white" opacity="0.5"/><circle cx="30" cy="60" r="1" fill="white" opacity="0.9"/><circle cx="70" cy="70" r="0.4" fill="white" opacity="0.6"/><circle cx="50" cy="10" r="0.9" fill="white" opacity="0.8"/><circle cx="15" cy="50" r="1.1" fill="white" opacity="0.7"/></svg>') repeat;background-size:200px 200px;animation:move-twink-back 200s linear infinite}#LogBookIntro .animated-bg .twinkling{background:transparent url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="25" cy="25" r="0.5" fill="white" opacity="0.3"/><circle cx="75" cy="15" r="0.3" fill="white" opacity="0.2"/><circle cx="15" cy="75" r="0.4" fill="white" opacity="0.4"/><circle cx="85" cy="85" r="0.6" fill="white" opacity="0.3"/><circle cx="45" cy="45" r="0.2" fill="white" opacity="0.5"/></svg>') repeat;background-size:300px 300px;animation:move-twink-back 100s linear infinite}#LogBookIntro .animated-bg .clouds{background:transparent url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 20"><path d="M10,10 Q20,5 30,10 T50,10 T70,10 T90,10" stroke="rgba(255,255,255,0.1)" stroke-width="2" fill="none"/><path d="M5,15 Q15,10 25,15 T45,15 T65,15 T85,15" stroke="rgba(255,255,255,0.05)" stroke-width="1" fill="none"/></svg>') repeat;background-size:400px 100px;animation:move-clouds-back 200s linear infinite}#LogBookIntro .hero-section{height:200vh;display:flex;align-items:center;justify-content:center;position:relative;padding:2rem;text-align:center;transition:all .2s ease}#LogBookIntro .hero-section .hero-content{max-width:800px;z-index:2;position:sticky;top:10vh;transform:translateY(-55vh);width:100%;transition:opacity .1s ease-out}#LogBookIntro .hero-section .hero-content .hero-logo{margin-bottom:2rem;text-align:center;animation:spin2 2.5s ease-in-out infinite}#LogBookIntro .hero-section .hero-content .hero-logo .logo-image{max-width:300px;height:auto;opacity:0;transform:translateY(30px);transition:all .8s ease;will-change:opacity,transform;animation:upAndDown 3s ease-in-out infinite}#LogBookIntro .hero-section .hero-content .hero-logo .logo-image.animate{opacity:1;transform:translateY(0)}#LogBookIntro .hero-section .hero-content .hero-title{margin-bottom:2rem;animation:upAndDown2 2.5s ease-in-out infinite}#LogBookIntro .hero-section .hero-content .hero-title .title-main{display:block;font-size:4.5rem;font-weight:900;background:linear-gradient(45deg,#ff6b6b,#4ecdc4,#45b7d1,#96ceb4,#feca57);background-size:300% 300%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradient-shift 3s ease-in-out infinite;text-shadow:0 0 30px rgba(255,255,255,.3);margin-bottom:1rem}#LogBookIntro .hero-section .hero-content .hero-title .title-sub{display:block;font-size:1.5rem;color:#fffc;letter-spacing:2px}#LogBookIntro .hero-section .hero-content .hero-description{font-size:1.2rem;line-height:1.8;color:#ffffffb3;margin-bottom:3rem;max-width:600px;margin-left:auto;margin-right:auto;animation:upAndDown2 2.3s ease-in-out infinite}#LogBookIntro .hero-section .hero-content .hero-buttons{display:flex;gap:1.5rem;justify-content:center;flex-wrap:wrap}#LogBookIntro .hero-section .hero-content .hero-buttons .btn{padding:1rem 2.5rem;border-radius:50px;text-decoration:none;font-weight:600;font-size:1.1rem;transition:all .3s ease;position:relative;overflow:hidden;border:2px solid transparent}#LogBookIntro .hero-section .hero-content .hero-buttons .btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}#LogBookIntro .hero-section .hero-content .hero-buttons .btn:hover:before{left:100%}#LogBookIntro .hero-section .hero-content .hero-buttons .btn.btn-primary{background:linear-gradient(135deg,#9a9a9a,#6f6f6f,#474747,#232323,#000);background-size:300% 300%;animation:gradient-shift 3s ease-in-out infinite;color:#fff;box-shadow:0 10px 30px #667eea66}#LogBookIntro .hero-section .hero-content .hero-buttons .btn.btn-primary:hover{transform:translateY(-3px);box-shadow:0 15px 40px #667eea99}#LogBookIntro .hero-section .hero-content .hero-buttons .btn.btn-secondary{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(20px)}#LogBookIntro .hero-section .hero-content .hero-buttons .btn.btn-secondary:hover{background:#ffffff1a;border-color:#fff9;transform:translateY(-3px)}#LogBookIntro .hero-section .hero-visual{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}#LogBookIntro .hero-section .hero-visual .floating-elements{position:relative;width:100%;height:100%}#LogBookIntro .hero-section .hero-visual .floating-elements .element{position:absolute;font-size:3rem;animation:float 6s ease-in-out infinite;opacity:.7}#LogBookIntro .hero-section .hero-visual .floating-elements .element.element-1{top:20%;left:90%;animation-delay:0s}#LogBookIntro .hero-section .hero-visual .floating-elements .element.element-2{top:30%;left:15%;animation-delay:1s}#LogBookIntro .hero-section .hero-visual .floating-elements .element.element-3{top:30%;left:80%;animation-delay:2s}#LogBookIntro .hero-section .hero-visual .floating-elements .element.element-4{top:10%;left:90%;animation-delay:3s}#LogBookIntro .hero-section .hero-visual .floating-elements .element.element-5{top:40%;left:50%;animation-delay:4s}#LogBookIntro .hero-section .hero-visual .floating-elements .element.element-6{top:15%;left:10%;animation-delay:5s}#LogBookIntro .hero-section .hero-visual .floating-elements .element.element-7{top:10%;left:30%;animation-delay:6s}#LogBookIntro .features-section{padding:8rem 2rem;position:relative;z-index:1}#LogBookIntro .features-section .container{max-width:1200px;margin:0 auto}#LogBookIntro .features-section .section-title{text-align:center;margin-bottom:5rem}#LogBookIntro .features-section .section-title .title-text{font-size:3rem;font-weight:700;background:linear-gradient(45deg,#ff6b6b,#4ecdc4);background-size:200% 200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradient-shift 3s ease-in-out infinite;opacity:0;transform:translateY(50px);transition:all .8s ease}#LogBookIntro .features-section .section-title .title-text.animate{opacity:1;transform:translateY(0)}#LogBookIntro .features-section .features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:3rem;margin-top:4rem}#LogBookIntro .features-section .features-grid .feature-card{background:#ffffff0d;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:2.5rem;text-align:center;transition:all .5s ease;opacity:0;transform:translateY(50px);transition-delay:calc(var(--delay, 0) * 1s);will-change:opacity,transform;z-index:999}#LogBookIntro .features-section .features-grid .feature-card.animate{opacity:1;transform:translateY(0)}#LogBookIntro .features-section .features-grid .feature-card:hover{transform:translateY(-10px);box-shadow:0 20px 40px #0000004d;border-color:#ffffff4d}#LogBookIntro .features-section .features-grid .feature-card .feature-icon{width:80px;height:80px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2.5rem;margin:0 auto 2rem;box-shadow:0 10px 30px #0000004d}#LogBookIntro .features-section .features-grid .feature-card .feature-title{font-size:1.5rem;font-weight:600;margin-bottom:1rem;color:#fff}#LogBookIntro .features-section .features-grid .feature-card .feature-description{color:#ffffffb3;line-height:1.6;font-size:1rem;margin-bottom:1.5rem}#LogBookIntro .features-section .features-grid .feature-card .feature-tech{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}#LogBookIntro .features-section .features-grid .feature-card .feature-tech .tech-tag{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);border-radius:20px;padding:.3rem .8rem;font-size:.8rem;color:#fffc;font-weight:500;transition:all .3s ease}#LogBookIntro .features-section .features-grid .feature-card .feature-tech .tech-tag:hover{background:#fff3;border-color:#fff6;transform:translateY(-2px)}#LogBookIntro .features-section .feature-vid{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(.8);width:auto;height:70vh;z-index:1000;opacity:0;transition:all .5s ease-in-out;border:2px solid #ccc;border-radius:20px;overflow:hidden;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);pointer-events:none}#LogBookIntro .features-section .feature-vid.active{opacity:1;transform:translate(-50%,-50%) scale(1)}#LogBookIntro .features-section video{width:auto;height:100%;object-fit:cover}#LogBookIntro .tech-section{padding:8rem 2rem;background:#ffffff05}#LogBookIntro .tech-section .container{max-width:1200px;margin:0 auto}#LogBookIntro .tech-section .section-title{text-align:center;margin-bottom:5rem}#LogBookIntro .tech-section .section-title .title-text{font-size:3rem;font-weight:700;background:linear-gradient(45deg,#ff6b6b,#4ecdc4,#45b7d1);background-size:200% 200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradient-shift 3s ease-in-out infinite;opacity:0;transform:translateY(50px);transition:all .8s ease}#LogBookIntro .tech-section .section-title .title-text.animate{opacity:1;transform:translateY(0)}#LogBookIntro .tech-section .tech-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:3rem;opacity:0;transform:translateY(50px);transition:all .8s ease}#LogBookIntro .tech-section .tech-grid.animate{opacity:1;transform:translateY(0)}#LogBookIntro .tech-section .tech-grid .tech-category{background:#ffffff0d;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:2.5rem;transition:all .5s ease;transition-delay:calc(var(--delay, 0) * 1s);opacity:0;transform:translateY(50px);will-change:opacity,transform}#LogBookIntro .tech-section .tech-grid .tech-category.animate{opacity:1;transform:translateY(0)}#LogBookIntro .tech-section .tech-grid .tech-category:hover{transform:translateY(-10px);box-shadow:0 20px 40px #0000004d;border-color:#ffffff4d}#LogBookIntro .tech-section .tech-grid .tech-category .category-title{font-size:1.8rem;font-weight:700;margin-bottom:2rem;text-align:center;background:linear-gradient(45deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}#LogBookIntro .tech-section .tech-grid .tech-category .tech-items{display:flex;flex-direction:column;gap:1.5rem}#LogBookIntro .tech-section .tech-grid .tech-category .tech-items .tech-item{display:flex;align-items:center;gap:1rem;padding:1rem;background:#ffffff08;border-radius:15px;transition:all .3s ease}#LogBookIntro .tech-section .tech-grid .tech-category .tech-items .tech-item:hover{background:#ffffff14;transform:translate(10px)}#LogBookIntro .tech-section .tech-grid .tech-category .tech-items .tech-item .tech-icon{font-size:2rem;width:50px;height:50px;display:flex;align-items:center;justify-content:center;background:#ffffff1a;border-radius:50%;flex-shrink:0}#LogBookIntro .tech-section .tech-grid .tech-category .tech-items .tech-item .tech-info{flex:1}#LogBookIntro .tech-section .tech-grid .tech-category .tech-items .tech-item .tech-info .tech-name{font-size:1.2rem;font-weight:600;color:#fff;margin-bottom:.5rem}#LogBookIntro .tech-section .tech-grid .tech-category .tech-items .tech-item .tech-info .tech-description{color:#ffffffb3;font-size:.9rem;line-height:1.4}#LogBookIntro .demo-section{padding:8rem 2rem;background:#ffffff05}#LogBookIntro .demo-section .container{max-width:1200px;margin:0 auto}#LogBookIntro .demo-section .section-title{text-align:center;margin-bottom:5rem}#LogBookIntro .demo-section .section-title .title-text{font-size:3rem;font-weight:700;background:linear-gradient(135deg,#4ecdc4,#45b7d1,#667eea);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;background-size:300% 300%;animation:gradient-shift 3s ease-in-out infinite;opacity:0;transform:translateY(50px);transition:all .8s ease}#LogBookIntro .demo-section .section-title .title-text.animate{opacity:1;transform:translateY(0)}#LogBookIntro .demo-section .demo-content .demo-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;opacity:0;transform:translateY(50px);transition:all .8s ease}#LogBookIntro .demo-section .demo-content .demo-cards.animate{opacity:1;transform:translateY(0)}#LogBookIntro .demo-section .demo-content .demo-cards .demo-card{background:#ffffff0d;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:3rem 2rem;text-align:center;text-decoration:none;color:#fff;transition:all .3s ease;position:relative;overflow:hidden}#LogBookIntro .demo-section .demo-content .demo-cards .demo-card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.1),transparent);opacity:0;transition:opacity .3s ease}#LogBookIntro .demo-section .demo-content .demo-cards .demo-card:hover{transform:translateY(-10px);box-shadow:0 20px 40px #0000004d;border-color:#ffffff4d}#LogBookIntro .demo-section .demo-content .demo-cards .demo-card:hover:before{opacity:1}#LogBookIntro .demo-section .demo-content .demo-cards .demo-card .demo-icon{font-size:4rem;margin-bottom:1.5rem}#LogBookIntro .demo-section .demo-content .demo-cards .demo-card h3{font-size:1.5rem;font-weight:600;margin-bottom:1rem}#LogBookIntro .demo-section .demo-content .demo-cards .demo-card p{color:#ffffffb3;line-height:1.6}#LogBookIntro .demo-section .demo-content .demo-cards .demo-card.blog-demo{border-left:4px solid #667eea}#LogBookIntro .demo-section .demo-content .demo-cards .demo-card.chat-demo{border-left:4px solid #f093fb}#LogBookIntro .demo-section .demo-content .demo-cards .demo-card.signup-demo{border-left:4px solid #4facfe}#LogBookIntro .cta-section{padding:8rem 2rem;text-align:center;background:linear-gradient(135deg,#667eea1a,#764ba21a)}#LogBookIntro .cta-section .container{max-width:800px;margin:0 auto}#LogBookIntro .cta-section .cta-content .cta-title{font-size:3rem;font-weight:700;margin-bottom:2rem;background:linear-gradient(45deg,#ff6b6b,#4ecdc4,#45b7d1);background-size:200% 200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradient-shift 3s ease-in-out infinite;opacity:0;transform:translateY(50px);transition:all .8s ease}#LogBookIntro .cta-section .cta-content .cta-title.animate{opacity:1;transform:translateY(0)}#LogBookIntro .cta-section .cta-content .cta-description{font-size:1.3rem;color:#fffc;margin-bottom:3rem;opacity:0;transform:translateY(50px);transition:all .8s ease .2s}#LogBookIntro .cta-section .cta-content .cta-description.animate{opacity:1;transform:translateY(0)}#LogBookIntro .cta-section .cta-content .btn-cta{display:inline-block;padding:1.5rem 3rem;background:linear-gradient(135deg,#667eea,#764ba2);background-size:300% 300%;animation:gradient-shift 3s ease-in-out infinite;color:#fff;text-decoration:none;border-radius:50px;font-weight:600;font-size:1.2rem;box-shadow:0 10px 30px #667eea66;opacity:0;transform:translateY(50px);transition:all .8s ease .4s}#LogBookIntro .cta-section .cta-content .btn-cta.animate{opacity:1;transform:translateY(0)}#LogBookIntro .cta-section .cta-content .btn-cta:hover{transform:translateY(-5px);box-shadow:0 20px 40px #667eea99}@media(max-width:768px){#LogBookIntro .hero-section{padding:1rem;min-height:100vh}#LogBookIntro .hero-section .hero-content .hero-logo .logo-image{max-width:250px}#LogBookIntro .hero-section .hero-content .hero-title .title-main{font-size:3rem;line-height:1.1}#LogBookIntro .hero-section .hero-content .hero-title .title-sub{font-size:1.2rem;letter-spacing:1px}#LogBookIntro .hero-section .hero-content .hero-description{font-size:1rem;line-height:1.6}#LogBookIntro .hero-section .hero-content .hero-buttons{flex-direction:column;align-items:center;gap:1rem}#LogBookIntro .hero-section .hero-content .hero-buttons .btn{width:100%;max-width:300px;padding:.8rem 2rem;font-size:1rem}#LogBookIntro .hero-section .hero-visual .floating-elements .element{font-size:2rem;opacity:.5}#LogBookIntro .features-section{padding:4rem 1rem}#LogBookIntro .features-section .section-title .title-text{font-size:2rem}#LogBookIntro .features-section .features-grid{grid-template-columns:1fr;gap:2rem}#LogBookIntro .tech-section{padding:4rem 1rem}#LogBookIntro .tech-section .section-title .title-text{font-size:2rem}#LogBookIntro .tech-section .tech-grid{grid-template-columns:1fr;gap:2rem}#LogBookIntro .tech-section .tech-grid .tech-category{padding:2rem 1.5rem}#LogBookIntro .demo-section{padding:4rem 1rem}#LogBookIntro .demo-section .section-title .title-text{font-size:2rem}#LogBookIntro .demo-section .demo-content .demo-cards{grid-template-columns:1fr}#LogBookIntro .cta-section{padding:4rem 1rem}#LogBookIntro .cta-section .cta-content .cta-title{font-size:2rem}#LogBookIntro .cta-section .cta-content .cta-description{font-size:1.1rem}}@media(max-width:480px){#LogBookIntro .hero-section .hero-content .hero-logo .logo-image{max-width:200px}#LogBookIntro .hero-section .hero-content .hero-title .title-main{font-size:2.5rem;line-height:1.1}#LogBookIntro .hero-section .hero-content .hero-title .title-sub{font-size:1rem}#LogBookIntro .hero-section .hero-content .hero-description{font-size:.9rem}#LogBookIntro .animated-bg .stars,#LogBookIntro .animated-bg .twinkling,#LogBookIntro .animated-bg .clouds{animation-duration:300s}#LogBookIntro .features-section .features-grid .feature-card{padding:2rem 1.5rem}#LogBookIntro .tech-section .tech-grid .tech-category{padding:1.5rem 1rem}#LogBookIntro .tech-section .tech-grid .tech-category .tech-items .tech-item{padding:.8rem;gap:.8rem}#LogBookIntro .tech-section .tech-grid .tech-category .tech-items .tech-item .tech-icon{width:40px;height:40px;font-size:1.5rem}#LogBookIntro .tech-section .tech-grid .tech-category .tech-items .tech-item .tech-info .tech-name{font-size:1rem}#LogBookIntro .tech-section .tech-grid .tech-category .tech-items .tech-item .tech-info .tech-description{font-size:.8rem}#LogBookIntro .demo-section .demo-content .demo-cards .demo-card{padding:2rem 1.5rem}}.post-editor-container{position:relative;display:flex;min-height:500px!important;height:calc(100vh - 100px);font-family:Pretendard Variable,Pretendard,sans-serif;font-size:16px;background-color:#f8f9fa;color:#333;overflow:hidden}.post-editor-container .post-editor{display:flex;flex-direction:column;flex:1;height:100%;overflow-y:auto;border-right:1px solid #e0e0e0}.post-editor-container .post-editor .post-title-area{width:100%;height:82px;padding:16px 20px;margin-bottom:16px;animation-name:post-editor-slide-down;animation-duration:.3s;animation-timing-function:ease-out;animation-fill-mode:forwards}.post-editor-container .post-editor .post-title-area.hidden-title{animation-name:post-editor-slide-up}.post-editor-container .post-editor .post-title-area .post-title-input{width:100%;height:100%;font-size:40px;font-weight:700;border:none;background-color:#f8f9fa}.post-editor-container .post-editor .post-title-area .post-title-input:focus{outline:none}.post-editor-container .post-editor .post-title-area:after{content:"";display:block;width:80px;height:6px;margin-top:14px;background-color:#414141}.post-editor-container .post-editor .post-tags-area{position:relative;display:flex;flex-wrap:wrap;gap:14px;padding:0 20px;margin-bottom:16px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;animation-name:post-editor-slide-down;animation-duration:.3s;animation-timing-function:ease-out;animation-fill-mode:forwards}.post-editor-container .post-editor .post-tags-area.hidden-tags{animation-name:post-editor-slide-up}.post-editor-container .post-editor .post-tags-area .tag-item{display:inline-flex}.post-editor-container .post-editor .post-tags-area .tag-item .tag-button{padding:4px 10px;border-radius:12px;font-weight:700;color:#299440;background-color:#92f2a75d;transition:.2s}.post-editor-container .post-editor .post-tags-area .tag-item .tag-button:hover{color:#fff;background-color:#299440}.post-editor-container .post-editor .post-tags-area .post-tag-input{display:inline-flex;height:24px;font-size:16px;border:none;background-color:#f8f9fa}.post-editor-container .post-editor .post-tags-area .post-tag-input:focus{outline:none}.post-editor-container .post-editor .post-tags-area i{display:block;position:absolute;bottom:-65px;left:10px;padding:10px 14px;font-size:12px;border-radius:8px;color:#fff;background-color:#414141;animation-name:tooltip-slide-down;animation-duration:.3s;animation-timing-function:ease-out;animation-fill-mode:forwards}.post-editor-container .post-editor .post-tags-area i.tooltip-hidden{animation-name:tooltip-slide-up}.post-editor-container .post-editor .post-editor-toolbar{display:flex;justify-content:center;gap:20px;padding:10px 20px;background-color:#f8f9fa;animation-name:post-editor-toolbar-slide-down;animation-duration:.3s;animation-timing-function:ease-out}.post-editor-container .post-editor .post-editor-toolbar.toolbar-top-position{animation-name:post-editor-toolbar-slide-up;box-shadow:0 8px 6px -6px #d8d8d8}.post-editor-container .post-editor .post-editor-toolbar button{width:30px;height:30px}.post-editor-container .post-editor .post-editor-toolbar button:hover{border-radius:4px;background-color:#83838367}.post-editor-container .post-editor .post-editor-toolbar button img{width:80%;pointer-events:none}.post-editor-container .post-editor .post-editor-toolbar .bold-btn,.post-editor-container .post-editor .post-editor-toolbar .italic-btn,.post-editor-container .post-editor .post-editor-toolbar .line-through-btn,.post-editor-container .post-editor .post-editor-toolbar .quote-btn,.post-editor-container .post-editor .post-editor-toolbar .link-btn{padding:3px}.post-editor-container .post-editor .post-editor-toolbar .toolbar-separator{display:block;width:3px;height:20px;margin-top:4px;background-color:#6a737d}.post-editor-container .post-editor .textarea-wrapper{position:relative;width:100%;height:100%;overflow:hidden}.post-editor-container .post-editor .textarea-wrapper .markdown-textarea{font-family:Pretendard Variable,Pretendard,sans-serif;width:100%;height:100%;border:none;outline:none;resize:none;font-size:16px;line-height:1.6;padding:10px 20px;background:transparent;box-sizing:border-box;animation-name:post-editor-toolbar-slide-down;animation-duration:.3s;animation-timing-function:ease-out}.post-editor-container .post-editor .textarea-wrapper .markdown-textarea.markdown-top-position{animation-name:post-editor-toolbar-slide-up}.post-editor-container .post-editor .textarea-wrapper .post-editor-modal{position:absolute;height:80px;color:#121212;padding:10px;border-radius:8px;background-color:#f8f9fa;box-shadow:0 0 5px #b9b9b9;z-index:1500}.post-editor-container .post-editor .textarea-wrapper .post-editor-modal>div{display:flex;flex-direction:column;justify-content:space-between;width:250px;height:100%}.post-editor-container .post-editor .textarea-wrapper .post-editor-modal>div.link-input-modal input,.post-editor-container .post-editor .textarea-wrapper .post-editor-modal>div.image-src-modal input{width:180px;height:30px}.post-editor-container .post-editor .textarea-wrapper .post-editor-modal>div.code-type-modal{width:180px}.post-editor-container .post-editor .textarea-wrapper .post-editor-modal>div.code-type-modal select{width:120px;height:30px}.post-editor-container .post-editor .textarea-wrapper .post-editor-modal button{position:absolute;right:10px;bottom:10px;width:50px;height:30px;font-size:16px;border:1px solid #dfe2e5;border-radius:4px;background-color:#f8f9fa}.post-editor-container .post-editor .textarea-wrapper .mirror-div{visibility:hidden;position:absolute;top:0;left:0;width:100%;height:100%;font-size:16px;line-height:1.6;padding:10px 20px;white-space:pre-wrap;word-wrap:break-word;overflow:visible;pointer-events:none;box-sizing:border-box}.post-editor-container .post-editor .post-editor-btns{width:100%;display:flex;justify-content:flex-end;align-items:center;gap:18px;padding:10px 20px;border-top:1px solid #dfe2e5;background-color:#fff}.post-editor-container .post-editor .post-editor-btns button{width:90px;height:40px;font-size:18px;border-radius:8px}.post-editor-container .post-editor .post-editor-btns .post-save-btn{color:#fff;background-color:#414141}.post-editor-container .post-editor .post-editor-btns .post-cancel-btn{border:2px solid #dfe2e5;background-color:#f8f9fa}.post-editor-container .post-preview{flex:1;height:100%;padding:20px;overflow-y:auto;background-color:#fff}.post-editor-container .post-preview .post-preview-title h1{font-size:3em;font-weight:700;margin-bottom:32px}.post-editor-container .post-preview h1,.post-editor-container .post-preview h2,.post-editor-container .post-preview h3,.post-editor-container .post-preview h4,.post-editor-container .post-preview h5,.post-editor-container .post-preview h6{margin-top:8px;margin-bottom:8px;font-weight:600;line-height:1.25}.post-editor-container .post-preview h1{font-size:2.25em}.post-editor-container .post-preview h2{font-size:1.8em}.post-editor-container .post-preview h3{font-size:1.4em}.post-editor-container .post-preview p{margin-top:0;margin-bottom:16px}.post-editor-container .post-preview a{color:#0366d6;text-decoration:none}.post-editor-container .post-preview a:hover{text-decoration:underline}.post-editor-container .post-preview code{padding:.2em .4em;margin:0;font-size:90%;line-height:1;background-color:#1b1f230d;border-radius:3px}.post-editor-container .post-preview pre{padding:16px;overflow:auto;font-size:85%;line-height:1;background-color:#f6f8fa;border-radius:6px;margin-bottom:8px}.post-editor-container .post-preview pre .code-block code{display:inline;padding:0;margin:0;overflow:visible;word-wrap:normal;background-color:transparent;border:0}.post-editor-container .post-preview pre .code-block code span{line-height:1}.post-editor-container .post-preview ul,.post-editor-container .post-preview ol{padding-left:2em;margin-top:0;margin-bottom:16px}.post-editor-container .post-preview li{list-style:inside}.post-editor-container .post-preview blockquote{color:#6a737d;padding:0 1em;margin-left:0;border-left:.25em solid #dfe2e5}.post-editor-container .post-preview blockquote p{margin-bottom:0}#PostDetail{padding:60px 0}#PostDetail .follow-post-owner{width:70px;height:30px;font-weight:600;color:#299440;background-color:#92f2a75d;border:1px solid #299440;border-radius:15px;transition:.2s}#PostDetail .follow-post-owner.following{width:90px;color:#fff;background-color:#299440}#PostDetail .follow-post-owner.following:hover{color:#299440}#PostDetail .follow-post-owner:hover{background-color:#92f2a790}#PostDetail .post-wrapper{display:flex;flex-direction:column}#PostDetail .post-wrapper--inactive{opacity:.85}#PostDetail .post-wrapper .post-inactive-banner{padding:.75rem 1rem;margin-bottom:1rem;background:#fef3c7;color:#92400e;border-radius:8px;font-size:.95rem;font-weight:500}#PostDetail .post-wrapper .post-wrapper__content{display:flex;padding-right:200px}#PostDetail .post-wrapper .sticky-area{position:relative;display:flex;justify-content:center;width:200px}#PostDetail .post-wrapper .sticky-area .sticky-utils{position:sticky;top:20vh;display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:7px 0;width:64px;height:150px;border:1px solid #efefef;border-radius:32px;background-color:#f8f9fa;box-shadow:5px 5px 10px #eee}#PostDetail .post-wrapper .sticky-area .sticky-utils .utils-like .like-btn{margin-bottom:2px}#PostDetail .post-wrapper .sticky-area .sticky-utils .utils-like .like-btn.liked{background-color:#ec5983}#PostDetail .post-wrapper .sticky-area .sticky-utils .utils-like .like-btn.liked svg{filter:contrast(10%) brightness(300%)}#PostDetail .post-wrapper .sticky-area .sticky-utils .utils-like p{text-align:center;font-size:12px;font-weight:600}#PostDetail .post-wrapper .sticky-area .sticky-utils button{display:flex;justify-content:center;align-items:center;width:53px;height:53px;border:1px solid #efefef;border-radius:50%;background-color:#fff;transition:.3s}#PostDetail .post-wrapper .sticky-area .sticky-utils button svg{filter:contrast(10%) brightness(140%)}#PostDetail .post-wrapper .sticky-area .sticky-utils button:hover{border:1.5px solid #333}#PostDetail .post-wrapper .sticky-area .sticky-utils button:hover svg{filter:contrast(10%) brightness(10%)}#PostDetail .post-wrapper .post-area{width:100%}#PostDetail .post-wrapper .post-area .post-header{padding-bottom:24px}#PostDetail .post-wrapper .post-area .post-header .post-title{font-size:40px;font-weight:700;margin-bottom:24px}#PostDetail .post-wrapper .post-area .post-header .post-info-area .post-info-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}#PostDetail .post-wrapper .post-area .post-header .post-info-area .post-info-top .post-info-left{display:flex;align-items:center;gap:8px}#PostDetail .post-wrapper .post-area .post-header .post-info-area .post-info-top .post-info-left .profile-photo-small{width:40px;height:40px;border-radius:50%;overflow:hidden}#PostDetail .post-wrapper .post-area .post-header .post-info-area .post-info-top .post-info-left .profile-photo-small img{width:100%;height:100%;object-fit:cover}#PostDetail .post-wrapper .post-area .post-header .post-info-area .post-info-top .post-info-left .post-owner{color:#414141;font-size:18px;font-weight:700;text-decoration:underline}#PostDetail .post-wrapper .post-area .post-header .post-info-area .post-info-top .post-info-left .post-owner:hover{color:#6a737d}#PostDetail .post-wrapper .post-area .post-header .post-info-area .post-info-top .post-edit-btns{display:flex;align-items:center;gap:16px}#PostDetail .post-wrapper .post-area .post-header .post-info-area .post-info-top .post-edit-btns .edit-post-btn,#PostDetail .post-wrapper .post-area .post-header .post-info-area .post-info-top .post-edit-btns .delete-post-btn{color:#6a737d;font-size:16px;font-weight:600;line-height:1em}#PostDetail .post-wrapper .post-area .post-header .post-info-area .post-info-top .post-edit-btns .edit-post-btn:hover,#PostDetail .post-wrapper .post-area .post-header .post-info-area .post-info-top .post-edit-btns .delete-post-btn:hover{color:#333}#PostDetail .post-wrapper .post-area .post-header .post-info-area .post-tags{display:flex;gap:8px;flex-wrap:wrap}#PostDetail .post-wrapper .post-area .post-header .post-info-area .post-tags .tag-button{padding:4px 10px;border-radius:12px;font-weight:700;color:#299440;background-color:#92f2a75d;transition:.2s}#PostDetail .post-wrapper .post-area .post-header .post-info-area .post-tags .tag-button:hover{color:#fff;background-color:#299440}#PostDetail .post-wrapper .post-area .post-viewer{padding:20px;margin-bottom:16px}#PostDetail .post-wrapper .post-area .post-viewer h1,#PostDetail .post-wrapper .post-area .post-viewer h2,#PostDetail .post-wrapper .post-area .post-viewer h3,#PostDetail .post-wrapper .post-area .post-viewer h4,#PostDetail .post-wrapper .post-area .post-viewer h5,#PostDetail .post-wrapper .post-area .post-viewer h6{margin-top:8px;margin-bottom:8px;font-weight:600;line-height:1.25}#PostDetail .post-wrapper .post-area .post-viewer h1{font-size:2.25em}#PostDetail .post-wrapper .post-area .post-viewer h2{font-size:1.8em}#PostDetail .post-wrapper .post-area .post-viewer h3{font-size:1.4em}#PostDetail .post-wrapper .post-area .post-viewer p{margin-top:0;margin-bottom:16px}#PostDetail .post-wrapper .post-area .post-viewer a{color:#0366d6;text-decoration:none}#PostDetail .post-wrapper .post-area .post-viewer a:hover{text-decoration:underline}#PostDetail .post-wrapper .post-area .post-viewer code{padding:.2em .4em;margin:0;font-size:90%;line-height:1;background-color:#1b1f230d;border-radius:3px}#PostDetail .post-wrapper .post-area .post-viewer pre{padding:0 16px;overflow:auto;font-size:85%;line-height:1;background-color:#f6f8fa;border-radius:6px;margin-bottom:8px}#PostDetail .post-wrapper .post-area .post-viewer pre .code-block code{display:inline;padding:0;margin:0;overflow:visible;word-wrap:normal;background-color:transparent;border:0}#PostDetail .post-wrapper .post-area .post-viewer pre .code-block code span{line-height:1}#PostDetail .post-wrapper .post-area .post-viewer img{width:100%}#PostDetail .post-wrapper .post-area .post-viewer ul,#PostDetail .post-wrapper .post-area .post-viewer ol{padding-left:2em;margin-top:0;margin-bottom:16px}#PostDetail .post-wrapper .post-area .post-viewer li{list-style:inside}#PostDetail .post-wrapper .post-area .post-viewer blockquote{color:#6a737d;padding:0 1em;margin-left:0;border-left:.25em solid #dfe2e5;margin-bottom:16px}#PostDetail .post-wrapper .post-area .post-viewer blockquote p{margin-bottom:8px}#PostDetail .post-wrapper .post-area .post-viewer blockquote p:last-child{margin-bottom:0}#PostDetail .post-wrapper .post-area .post-owner{display:flex;justify-content:space-between;align-items:center}#PostDetail .post-wrapper .post-area .post-owner .profile-left{display:flex;align-items:center;gap:24px}#PostDetail .post-wrapper .post-area .post-owner .profile-left .profile-photo{width:120px;height:120px;border-radius:50%;overflow:hidden}#PostDetail .post-wrapper .post-area .post-owner .profile-left .profile-photo img{width:100%;height:100%;object-fit:cover}#PostDetail .post-wrapper .post-area .post-owner .profile-left .profile-text-area{display:flex;flex-direction:column;justify-content:center;gap:8px;width:350px}#PostDetail .post-wrapper .post-area .post-owner .profile-left .profile-text-area .user-nickname{color:#414141;font-size:24px;font-weight:700;text-decoration:underline}#PostDetail .post-wrapper .post-area .post-owner .profile-left .profile-text-area .user-nickname:hover{color:#6a737d}#PostDetail .post-wrapper .post-area .post-owner .profile-left .profile-text-area .user-introduction{font-size:18px}#PostDetail .post-loading{display:flex;justify-content:center;align-items:center;width:100%;height:500px}#PostDetail .post-loading .post-loading-animation{width:50px;height:50px;border:6px solid #f3f3f3;border-top:6px solid #3498db;border-radius:50%;animation:spin 1s linear infinite}#PostDetail .post-load-error{display:flex;justify-content:center;align-items:center}#PostDetail .post-load-error img{width:200px}.post-comments-section{max-width:800px;margin:40px auto}.post-comments-section .form-footer,.post-comments-section .reply-footer{display:flex;justify-content:flex-end;align-items:center;gap:12px;margin-top:8px}.post-comments-section .form-footer .char-count,.post-comments-section .reply-footer .char-count{font-size:.75rem;color:#adb5bd}.post-comments-section .form-footer .char-count.limit,.post-comments-section .reply-footer .char-count.limit{color:#fa5252;font-weight:700}.post-comments-section .comment-form{display:flex;flex-direction:column;margin-bottom:30px}.post-comments-section .comment-form textarea{font-family:Pretendard Variable,Pretendard,sans-serif;height:80px;padding:12px;border:1px solid #ddd;border-radius:4px;resize:none}.post-comments-section .comment-form button{align-self:flex-end;margin-top:10px;padding:8px 16px;background:#333;color:#fff;border:none;border-radius:4px;cursor:pointer;transition:background-color .2s}.post-comments-section .comment-form button:hover{background-color:#5e5e5e}.post-comments-section .comment-item.highlighted .comment-main{background-color:#b3e5fc!important;border:2px solid #03a9f4;box-shadow:0 0 12px #03a9f44d}.post-comments-section .comment-item .comment-replies{margin-left:20px;padding-left:10px}.post-comments-section .comment-item .comment-item .comment-replies{margin-left:0;padding-left:0;border-left:none}.post-comments-section .comment-item .comment-main{padding:16px;background-color:#f8f9fa;border-top:1px solid #eee;border-bottom:1px solid #eee;border-radius:16px;transition:background-color .2s}.post-comments-section .comment-item .comment-main:hover{background-color:#f1f3f5}.post-comments-section .comment-item .comment-main.active{border:2px solid #9b9b9b}.post-comments-section .comment-item .comment-header{display:flex;justify-content:space-between;margin-bottom:8px;font-size:.85rem}.post-comments-section .comment-item .comment-header .comment-author{font-weight:700;color:#333}.post-comments-section .comment-item .comment-header .comment-header-right-area{display:flex;gap:8px}.post-comments-section .comment-item .comment-header .comment-header-right-area .comment-buttons{display:flex;gap:6px}.post-comments-section .comment-item .comment-header .comment-header-right-area .comment-buttons button{transition:font-weight .2s}.post-comments-section .comment-item .comment-header .comment-header-right-area .comment-buttons button:hover{font-weight:700}.post-comments-section .comment-item .comment-header .comment-header-right-area .comment-date{color:#adb5bd}.post-comments-section .comment-item .comment-content{font-size:.95rem;color:#495057;line-height:1.6;white-space:pre-wrap}.post-comments-section .comment-item .comment-content .mention-tag{color:#228be6;font-weight:600;margin-right:4px}.post-comments-section .comment-item .comment-content .deleted-text{color:#a3a3a3;font-weight:600;font-style:italic}.post-comments-section .comment-item .comment-content .edit-input-wrapper{margin-top:10px;display:flex;flex-direction:column;gap:8px}.post-comments-section .comment-item .comment-content .edit-input-wrapper textarea{font-family:Pretendard Variable,Pretendard,sans-serif;width:100%;height:80px;padding:10px;border:1px solid #e9ecef;border-radius:8px;resize:none;font-size:.95rem;background-color:#fff}.post-comments-section .comment-item .comment-content .edit-input-wrapper textarea:focus{outline:none;border-color:#adb5bd}.post-comments-section .comment-item .comment-content .edit-input-wrapper .edit-actions{display:flex;justify-content:flex-end;gap:8px}.post-comments-section .comment-item .comment-content .edit-input-wrapper .edit-actions button{padding:6px 14px;font-size:.8rem;border-radius:4px;cursor:pointer;transition:all .2s;border:none}.post-comments-section .comment-item .comment-content .edit-input-wrapper .edit-actions button:first-child{background:#fff;border:1px solid #dee2e6;color:#495057}.post-comments-section .comment-item .comment-content .edit-input-wrapper .edit-actions button:first-child:hover{background-color:#f1f3f5}.post-comments-section .comment-item .comment-content .edit-input-wrapper .edit-actions button:last-child{background:#333;color:#fff}.post-comments-section .comment-item .comment-content .edit-input-wrapper .edit-actions button:last-child:hover{background-color:#5e5e5e}.post-comments-section .comment-item .reply-input-wrapper{padding:12px;background:#fff;border:1px solid #eee;border-radius:16px;margin:5px 0 10px}.post-comments-section .comment-item .reply-input-wrapper textarea{font-family:Pretendard Variable,Pretendard,sans-serif;width:100%;height:60px;border:1px solid #e9ecef;padding:10px;resize:none;border-radius:4px}.post-comments-section .comment-item .reply-input-wrapper .reply-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:8px}.post-comments-section .comment-item .reply-input-wrapper .reply-actions button{padding:6px 12px;font-size:.8rem;border-radius:4px;cursor:pointer}.post-comments-section .comment-item .reply-input-wrapper .reply-actions .cancel-btn{background:#fff;border:1px solid #dee2e6;transition:background-color .2s}.post-comments-section .comment-item .reply-input-wrapper .reply-actions .cancel-btn:hover{background-color:#ddd}.post-comments-section .comment-item .reply-input-wrapper .reply-actions .submit-btn{background:#333;color:#fff;border:none;transition:background-color .2s}.post-comments-section .comment-item .reply-input-wrapper .reply-actions .submit-btn:hover{background-color:#5e5e5e}.post-comments-section .empty-comments{width:100%;height:48px;padding:12px 24px;font-size:16px;font-style:italic;background-color:#ddd;border-radius:18px}.loading-comments{width:100%;height:48px;padding:12px 24px;font-size:18px;font-style:italic;margin-top:50px;background-color:#ddd;border-radius:18px}#ErrorPage{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;height:calc(100vh - 100px);padding:20px;text-align:center}#ErrorPage .animated-bg{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;overflow:hidden}#ErrorPage .animated-bg .stars,#ErrorPage .animated-bg .twinkling,#ErrorPage .animated-bg .clouds{position:absolute;inset:0;width:100%;height:100%;display:block}#ErrorPage .animated-bg .stars{background:#c3cfe2 url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="20" cy="20" r="1" fill="white" opacity="0.8"/><circle cx="80" cy="40" r="0.5" fill="white" opacity="0.6"/><circle cx="40" cy="80" r="1.5" fill="white" opacity="0.9"/><circle cx="90" cy="10" r="0.8" fill="white" opacity="0.7"/><circle cx="10" cy="90" r="1.2" fill="white" opacity="0.8"/><circle cx="60" cy="30" r="0.6" fill="white" opacity="0.5"/><circle cx="30" cy="60" r="1" fill="white" opacity="0.9"/><circle cx="70" cy="70" r="0.4" fill="white" opacity="0.6"/><circle cx="50" cy="10" r="0.9" fill="white" opacity="0.8"/><circle cx="15" cy="50" r="1.1" fill="white" opacity="0.7"/></svg>') repeat;background-size:200px 200px;animation:move-twink-back 200s linear infinite}#ErrorPage .animated-bg .twinkling{background:transparent url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="25" cy="25" r="0.5" fill="white" opacity="0.3"/><circle cx="75" cy="15" r="0.3" fill="white" opacity="0.2"/><circle cx="15" cy="75" r="0.4" fill="white" opacity="0.4"/><circle cx="85" cy="85" r="0.6" fill="white" opacity="0.3"/><circle cx="45" cy="45" r="0.2" fill="white" opacity="0.5"/></svg>') repeat;background-size:300px 300px;animation:move-twink-back 100s linear infinite}#ErrorPage .animated-bg .clouds{background:transparent url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 20"><path d="M10,10 Q20,5 30,10 T50,10 T70,10 T90,10" stroke="rgba(255,255,255,0.1)" stroke-width="2" fill="none"/><path d="M5,15 Q15,10 25,15 T45,15 T65,15 T85,15" stroke="rgba(255,255,255,0.05)" stroke-width="1" fill="none"/></svg>') repeat;background-size:400px 100px;animation:move-clouds-back 200s linear infinite}#ErrorPage .logo-wrapper{display:flex;flex-direction:column;align-items:center;justify-content:center;margin-bottom:40px;animation:upAndDown 3s ease-in-out infinite}#ErrorPage .logo-wrapper h1{font-size:48px;font-weight:700;color:#000;margin-bottom:20px;text-shadow:2px 2px 4px rgba(0,0,0,.1);letter-spacing:2px}#ErrorPage .logo-wrapper .error-logo{width:300px;height:300px;display:flex;align-items:center;justify-content:center;background:#fffc;border-radius:50%;box-shadow:0 8px 32px #0000001a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2)}#ErrorPage .logo-wrapper .error-logo img{width:80%;height:80%;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(0,0,0,.1));animation:spin2 2s ease-in-out infinite}#ErrorPage .text-wrapper{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;max-width:500px}#ErrorPage .text-wrapper h2{font-size:28px;font-weight:700;color:#000;margin-bottom:8px;text-shadow:1px 1px 2px rgba(0,0,0,.1)}#ErrorPage .text-wrapper p{font-size:18px;font-weight:500;color:#000;line-height:1.6;margin-bottom:8px}#ErrorPage .text-wrapper .button-wrapper{display:flex;gap:16px;margin-top:16px;flex-wrap:wrap;justify-content:center}#ErrorPage .text-wrapper .button-wrapper button{padding:12px 24px;font-size:16px;font-weight:600;color:#000;background:#ffffffe6;border:2px solid #000;border-radius:8px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #0000001a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}#ErrorPage .text-wrapper .button-wrapper button:hover{background:#000;color:#fff;transform:translateY(-2px);box-shadow:0 6px 20px #0003}#ErrorPage .text-wrapper .button-wrapper button:active{transform:translateY(0);box-shadow:0 2px 8px #0003}#ErrorPage .text-wrapper .button-wrapper a{padding:12px 24px;font-size:16px;font-weight:600;color:#000;background:#ffffffe6;border:2px solid #000;border-radius:8px;text-decoration:none;transition:all .3s ease;box-shadow:0 4px 12px #0000001a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:inline-block}#ErrorPage .text-wrapper .button-wrapper a:hover{background:#000;color:#fff;transform:translateY(-2px);box-shadow:0 6px 20px #0003}#ErrorPage .text-wrapper .button-wrapper a:active{transform:translateY(0);box-shadow:0 2px 8px #0003}@media(max-width:768px){#ErrorPage{padding:16px}#ErrorPage .logo-wrapper{margin-bottom:30px}#ErrorPage .logo-wrapper h1{font-size:36px;margin-bottom:16px}#ErrorPage .logo-wrapper .error-logo{width:200px;height:200px}#ErrorPage .text-wrapper{gap:20px}#ErrorPage .text-wrapper h2{font-size:24px}#ErrorPage .text-wrapper p{font-size:16px}#ErrorPage .text-wrapper .button-wrapper{gap:12px}#ErrorPage .text-wrapper .button-wrapper button,#ErrorPage .text-wrapper .button-wrapper a{padding:10px 20px;font-size:14px}}@media(max-width:480px){#ErrorPage .logo-wrapper h1{font-size:28px}#ErrorPage .logo-wrapper .error-logo{width:150px;height:150px}#ErrorPage .text-wrapper h2{font-size:20px}#ErrorPage .text-wrapper p{font-size:14px}#ErrorPage .text-wrapper .button-wrapper{flex-direction:column;align-items:center;width:100%}#ErrorPage .text-wrapper .button-wrapper button,#ErrorPage .text-wrapper .button-wrapper a{width:100%;max-width:200px}}.admin-modal-overlay{position:fixed;inset:0;background:#0006;display:flex;align-items:center;justify-content:center;z-index:1000}.admin-modal{background:#fff;border-radius:12px;padding:1.5rem;min-width:320px;box-shadow:0 8px 32px #00000026}.admin-modal__title{margin-bottom:.5rem;font-size:1.15rem}.admin-modal__user{margin-bottom:.5rem;color:#666;font-size:.9rem}.admin-modal__user--inactive{color:#92400e;font-weight:500}.admin-modal__post-info{margin-bottom:1rem}.admin-modal__label{display:block;margin-bottom:.5rem;font-weight:600;font-size:.9rem}.admin-modal__input,.admin-modal__select{display:block;width:100%;padding:.5rem .75rem;margin-bottom:1rem;border:1px solid #ddd;border-radius:6px;font-size:.95rem}.admin-modal__input,.admin-modal__select{margin-top:.25rem}.admin-modal__actions{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:flex-end}.admin-modal__btn{padding:.5rem 1rem;border-radius:6px;border:1px solid #ddd;background:#fff;cursor:pointer;font-size:.9rem}.admin-modal__btn:hover{background:#f5f5f5}.admin-modal__btn--primary{background:#1a1a1a;color:#fff;border-color:#1a1a1a}.admin-modal__btn--primary:hover:not(:disabled){background:#333}.admin-modal__btn--primary:disabled{opacity:.7;cursor:not-allowed}.admin-modal__btn--danger:hover{background:#fef2f2;border-color:#b91c1c;color:#b91c1c}.admin-list{overflow-x:auto}.admin-list--loading,.admin-list--empty{padding:2rem;text-align:center;color:#666}.admin-list__table{width:100%;border-collapse:collapse;font-size:.9rem}.admin-list__th{padding:.75rem 1rem;text-align:left;font-weight:600;background:#f0f0f0;border-bottom:2px solid #ddd}.admin-list__tr{border-bottom:1px solid #eee}.admin-list__tr:hover{background:#d1d1d1}.admin-list__tr--inactive{opacity:.65;background:#00000005}.admin-list__td{padding:.75rem 1rem;max-width:100px;min-width:10px;overflow-x:auto;text-overflow:ellipsis;white-space:nowrap}.admin-list__td--actions{white-space:nowrap}.user-role{display:inline-block;padding:.2rem .5rem;border-radius:4px;font-size:.85rem;font-weight:600}.user-role--admin{background:#4ecdc433;color:#0d9488}.user-role--user{background:#f0f0f0;color:#555}.user-role--guest{background:#fef3c7;color:#92400e}.admin-list-btns{display:flex;gap:.5rem}.admin-list-btn{padding:.35rem .75rem;font-size:.85rem;border:1px solid #ddd;border-radius:6px;background:#fff;cursor:pointer;transition:background .2s,border-color .2s}.admin-list-btn:hover{background:#f5f5f5;border-color:#ccc}.admin-pagination{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;margin-top:1rem;padding-top:1rem;border-top:1px solid #eee}.admin-pagination__info{margin:0;font-size:.9rem;color:#666}.admin-pagination__buttons{display:flex;align-items:center;gap:.25rem}.admin-pagination__list{display:flex;list-style:none;margin:0;padding:0;gap:.25rem}.admin-pagination__btn{padding:.4rem .75rem;font-size:.9rem;border:1px solid #ddd;border-radius:6px;background:#fff;cursor:pointer;min-width:2.25rem}.admin-pagination__btn:hover:not(:disabled){background:#f5f5f5}.admin-pagination__btn:disabled{opacity:.5;cursor:not-allowed}.admin-pagination__btn--num.active{background:#1a1a1a;color:#fff;border-color:#1a1a1a}.report-manage__detail{margin-bottom:1rem}.report-manage__description-full{margin:.25rem 0 1rem;padding:.75rem;background:#f9fafb;border-radius:6px;font-size:.9rem;line-height:1.5;white-space:pre-wrap;word-break:break-word}.report-manage__description{max-width:200px;display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}.report-manage__status{display:inline-block;padding:.2rem .5rem;border-radius:4px;font-size:.85rem;font-weight:500}.report-manage__status--pending{background:#fef3c7;color:#92400e}.report-manage__status--processed{background:#d1fae5;color:#065f46}.report-manage__status--rejected{background:#fee2e2;color:#991b1b}.report-manage__actions{display:flex;gap:.5rem;flex-wrap:wrap}.report-manage__btn{padding:.35rem .75rem;border-radius:6px;font-size:.85rem;font-weight:500;cursor:pointer;border:1px solid transparent;transition:background .15s,color .15s}.report-manage__btn:disabled{opacity:.7;cursor:not-allowed}.report-manage__btn--process{background:#0d9488;color:#fff;border-color:#0d9488}.report-manage__btn--process:hover:not(:disabled){background:#0f766e;border-color:#0f766e}.report-manage__btn--reject{background:#fff;color:#b91c1c;border-color:#b91c1c}.report-manage__btn--reject:hover:not(:disabled){background:#fef2f2}.report-manage__done{color:#6b7280;font-size:.9rem}.report-process-modal{max-width:480px}.report-process-modal__textarea{resize:vertical;min-height:80px;font-family:inherit;line-height:1.5}.chatroom-manage__description{max-width:180px;display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle;color:#666}.chatroom-manage__badge{display:inline-block;padding:.15rem .4rem;border-radius:4px;font-size:.8rem;font-weight:500}.chatroom-manage__badge--system{background:#e0e7ff;color:#3730a3}.chatroom-manage__badge--private{background:#fef3c7;color:#92400e}.stats-manage__loading{color:#666;padding:2rem 0}.stats-manage__cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:1rem;margin:1.5rem 0}.stats-manage__card{background:#fff;border:1px solid #eee;border-radius:10px;padding:1.25rem;display:flex;flex-direction:column;gap:.5rem;box-shadow:0 1px 3px #0000000d}.stats-manage__card-label{font-size:.9rem;color:#666}.stats-manage__card-value{font-size:1.75rem;font-weight:700;color:#1a1a1a}.stats-manage__charts{display:flex;flex-direction:column;gap:1.5rem;margin-top:2rem}.stats-manage__charts-row{display:flex;gap:1.5rem;align-items:flex-start;flex-wrap:wrap}.stats-manage__charts-row--tag-chat .stats-manage__chart-box--tag{flex:1;min-width:320px}.stats-manage__charts-row--tag-chat .stats-manage__chart-box--chat{flex-shrink:0;width:320px}@media(max-width:800px){.stats-manage__charts-row--tag-chat{flex-direction:column}.stats-manage__charts-row--tag-chat .stats-manage__chart-box--chat{width:100%}}.stats-manage__chart-box{background:#fff;border:1px solid #eee;border-radius:10px;padding:1.25rem;box-shadow:0 1px 3px #0000000d}.stats-manage__chart-inner{position:relative;overflow:visible}.stats-manage__chart-inner .recharts-wrapper{pointer-events:auto}.stats-manage__chart-title{font-size:1rem;margin-bottom:1rem;color:#333}.stats-manage__chart-note{font-size:.8rem;color:#999;margin:-.5rem 0 .75rem}.stats-manage__empty{display:flex;align-items:center;justify-content:center;height:240px;color:#999;font-size:.95rem}.commoncode-manage__loading,.commoncode-manage__empty{color:#666;padding:2rem 0}.commoncode-manage__table{overflow-x:auto;margin-top:1rem}.commoncode-manage__table-inner{width:100%;border-collapse:collapse;font-size:.9rem}.commoncode-manage__th{padding:.75rem 1rem;text-align:left;font-weight:600;background:#f0f0f0;border-bottom:2px solid #ddd}.commoncode-manage__th--toggle{width:40px;text-align:center}.commoncode-manage__td{padding:.6rem 1rem;border-bottom:1px solid #eee}.commoncode-manage__td--toggle{width:40px;text-align:center;cursor:pointer}.commoncode-manage__td--group{font-weight:600}.commoncode-manage__td--indent{padding-left:2rem;color:#666}.commoncode-manage__parent-row{cursor:pointer;background:#fafafa}.commoncode-manage__parent-row:hover{background:#f0f0f0}.commoncode-manage__child-row{background:#fff}.commoncode-manage__child-row:hover{background:#f9f9f9}.commoncode-manage__toggle{display:inline-block;font-size:.75rem;color:#666;transition:transform .2s}.commoncode-manage__toggle.expanded{transform:rotate(90deg)}.commoncode-manage__parent-label{color:#888;font-size:.85rem;font-weight:400}.commoncode-manage__use{display:inline-block;padding:.15rem .4rem;border-radius:4px;font-size:.85rem;font-weight:500}.commoncode-manage__use--y{background:#d1fae5;color:#065f46}.commoncode-manage__use--n{background:#f3f4f6;color:#6b7280}.admin-page{padding:2rem;max-width:1100px;margin:0 auto;min-height:60vh}.admin-page__header{margin-bottom:1.5rem}.admin-page__header h1{font-size:1.75rem;margin-bottom:.25rem}.admin-page__header p{color:#666;font-size:.95rem}.admin-page__tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem;padding-bottom:.75rem;border-bottom:2px solid #e0e0e0}.admin-page__tab{padding:.6rem 1.2rem;font-size:.95rem;font-weight:600;border:none;border-radius:8px;background:#f0f0f0;color:#555;cursor:pointer;transition:background .2s,color .2s}.admin-page__tab:hover{background:#e5e5e5;color:#333}.admin-page__tab.active{background:#1a1a1a;color:#fff}.admin-page__tab:focus-visible{outline:2px solid #4ecdc4;outline-offset:2px}.admin-page__panel{min-height:320px}.admin-page__content{padding:1.25rem;background:#fafafa;border-radius:10px;border:1px solid #eee}.admin-page__content h2{font-size:1.25rem;margin-bottom:.5rem}.admin-page__content p{color:#666;line-height:1.5}.admin-page__content__desc{margin-bottom:1rem}.admin-page__content .post-manage__title{font-weight:500;color:#1a1a1a}.admin-page__content .post-manage__title--inactive{opacity:.7}.admin-page__content .post-manage__inactive-badge{margin-left:.4rem;padding:.15rem .4rem;font-size:.75rem;background:#fef3c7;color:#92400e;border-radius:4px;font-weight:500}.admin-page__content .post-manage__preview{display:inline-block;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666}.admin-page__content__error{margin-bottom:1rem;padding:.5rem .75rem;background:#fef2f2;color:#b91c1c;border-radius:6px}#App{width:100%;height:100%}#Layout main>div{width:1200px;min-height:80vh;margin:0 auto}#Layout main #ChatPage,#Layout main #ErrorPage{width:100%}@keyframes modal-fade-in{0%{opacity:0}to{opacity:1}}@keyframes modal-slide-up{0%{opacity:0;transform:translateY(50px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes gradient-shift{0%,to{background-position:1% 50%}50%{background-position:99% 50%}}@keyframes float{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-20px) rotate(5deg)}}@keyframes move-twink-back{0%{background-position:0 0}to{background-position:-10000px 5000px}}@keyframes move-clouds-back{0%{background-position:0 0}to{background-position:10000px 0}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes spin2{0%,to{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}@keyframes spin3{0%,to{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}@keyframes upAndDown{0%,to{transform:translateY(-5px)}50%{transform:translateY(5px)}}@keyframes upAndDown2{0%,to{transform:translateY(-2px)}50%{transform:translateY(2px)}}@keyframes header-logo-animation{0%,to{transform:translateY(0)}50%{transform:translateY(2px)}}@keyframes header-logo-animation-2{0%,to{transform:rotate(0)}33%{transform:rotate(2deg)}66%{transform:rotate(-2deg)}}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(.9)}}@keyframes tooltip-slide-down{0%{opacity:0;transform:translateY(-30%)}to{opacity:1;transform:translateY(0)}}@keyframes tooltip-slide-up{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-20%);display:none}}@keyframes post-editor-slide-up{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-138px);display:none}}@keyframes post-editor-slide-down{0%{opacity:0;transform:translateY(-138px)}to{opacity:1;transform:translateY(0)}}@keyframes post-editor-toolbar-slide-up{0%{transform:translateY(0)}to{transform:translateY(-138px)}}@keyframes post-editor-toolbar-slide-down{0%{transform:translateY(-138px)}to{transform:translateY(0)}}@keyframes loading-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes slide-up{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.modal-fade-in{animation:modal-fade-in .2s ease-out}.modal-slide-up{animation:modal-slide-up .3s ease-out}.gradient-shift{animation:gradient-shift 3s ease-in-out infinite}.float{animation:float 6s ease-in-out infinite}.move-twink-back{animation:move-twink-back 200s linear infinite}.move-clouds-back{animation:move-clouds-back 200s linear infinite}.spin{animation:spin 1s linear infinite}.pulse{animation:pulse 2s infinite}.tooltip-slide-down{animation:tooltip-slide-down .2s ease-out}.tooltip-slide-up{animation:tooltip-slide-up .2s ease-out}.fade-in{animation:fade-in .2s ease-out}.slide-up{animation:slide-up .3s ease-out}