main{max-width:1100px;margin:2rem auto;padding:1rem;background-color:var(--emoji);box-shadow:0 4px 6px #0000001a;border-radius:1rem}main h2{font-size:2rem;margin-bottom:1rem;color:var(--text-color)}main p,ul{font-size:1.1rem;margin-bottom:1rem;color:var(--post-meta-color)}ul{padding-left:1.5rem}li{margin-bottom:.5rem}footer{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;padding:1rem 0;background-color:var(--highlight-color);color:var(--text-color)}.footer-sections{display:flex;flex-wrap:wrap;width:100%;max-width:1100px;justify-content:space-between;margin-bottom:1rem}.footer-links,.footer-contact{flex:1;min-width:250px;padding:0 1rem}footer h3{font-size:1.2rem;margin-bottom:.5rem}.footer-links ul{list-style:none;padding:0}.footer-links li{margin-bottom:.5rem}.footer-links a{color:var(--text-color);text-decoration:none}.footer-links a:hover{text-decoration:underline}footer p{margin:0;text-align:left;width:100%}footer .rights-reserved{text-align:center}section{margin-bottom:2rem;padding:1rem;background-color:var(--header-btn);box-shadow:0 2px 4px var(--shadow);border-radius:1rem;transition:transform .3s ease}section:hover{transform:translateY(-5px)}section:not(:last-child){margin-bottom:1.5rem}blockquote{font-style:italic;font-size:1.2rem;margin:1rem 0;position:relative;padding-left:1.5rem;border-left:2px solid var(--border-color);color:var(--text-color)}blockquote:before{content:"“";font-size:2rem;position:absolute;top:0;left:0;color:var(--highlight-color)}blockquote:after{content:"”";font-size:2rem;position:absolute;bottom:0;right:0;color:var(--highlight-color)}h3{color:var(--post-title-color)}cite{display:block;font-size:.9rem;font-style:normal;font-weight:700;text-align:right;margin-top:.5rem;color:var(--text-color)}.features{display:flex;flex-wrap:wrap;gap:2rem;margin-top:1rem}.features div{flex:1;min-width:250px;padding:1rem;background-color:var(--background);border-radius:1rem;box-shadow:0 4px 6px #0000001a}.features h3{font-size:1.5rem;margin-bottom:.5rem;color:#333}body{font-family:Roboto,sans-serif;margin:0;padding:0;box-sizing:border-box;background-color:var(--background);width:100%;overflow-x:hidden}body.no-scroll{overflow:hidden}.hidden{display:none}a{text-decoration:none;color:#333}.btn{display:inline-block;padding:.5rem 1rem;background-color:var(--detail-color);color:#fff;border-radius:5px;font-size:1rem;transition:all .3s ease}.btn:hover{background-color:#64a3ff}header{background-color:var(--header);padding:0 10%;border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}nav a{display:inline-block;margin-left:1rem;padding:.5rem 1rem;font-size:1.4rem;font-weight:500;color:var(--text-color);text-decoration:none;border-radius:8px;background-color:var(--header-btn);box-shadow:0 2px 4px var(--shadow);transition:all .5s ease}nav a:hover{box-shadow:0 4px 8px var(--shadow);transform:translateY(-2px)}nav a:active{box-shadow:none;transform:translateY(0)}.logo{color:var(--logo);font-size:2.5rem;transition:.3s;text-decoration:none}.logo:hover{color:var(--detail-color)}.dashboard-btn:hover{background-color:#fd8d8d}.login-btn:hover{background-color:#f3e8a6}.signup-btn:hover{background-color:#8cc1f6}.profile-btn:hover{background-color:#fff}.inbox-btn:hover{background-color:#d3d3d3}.search-btn:hover{background-color:#6477e5}.notification-btn.has-notification{background-color:#ff6a5f}.notification-btn:hover{background-color:#ffd87b}.notification-btn.has-notification:hover{background-color:#ff8e7f}.settings-btn:hover{background-color:#d3d3d3}.notification-container{position:relative;display:inline-block}.notification-panel{margin-top:10px;position:absolute;top:100%;left:50%;transform:translate(-50%);width:280px;background-color:var(--header-btn);border:1px solid var(--border-color);border-radius:6px;padding:15px;box-shadow:0 6px 12px #00000026;z-index:8000;font-family:Roboto,sans-serif;max-height:400px;overflow-y:auto;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}.notification-panel.show{opacity:1;visibility:visible}.notification-items{margin:0;padding:0;list-style-type:none;color:var(--text-color)}.notification-item{padding:12px;border-bottom:1px solid var(--border-color);background-color:var(--notification-item);border-radius:4px;margin-bottom:8px;transition:.3s ease}.unread{background-color:var(--notification-unread)}.notification-item:hover{box-shadow:0 6px 8px var(--shadow);transform:translateY(-2px)}.notification-item:last-child{border-bottom:none}.notification-title{font-weight:700;font-size:1.1em;margin-bottom:5px}.notification-content{font-size:.9em;color:var(--post-title-color);margin-bottom:5px;display:flex;align-items:center}.notification-timestamp{font-size:.8em;color:#999}.profile-btn-container{position:relative;display:inline-block}.profile-panel{display:flex;flex-direction:column;justify-content:center;align-items:center;position:absolute;top:80%;left:50%;transform:translate(-50%);border-radius:6px;padding:15px;z-index:8000;font-family:Roboto,sans-serif;max-height:400px;overflow-y:auto;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}.profile-panel.show{opacity:1;visibility:visible}.profile-sub-btn,.settings-sub-btn{text-align:center;display:block;padding:12px;border-bottom:1px solid var(--border-color);border-radius:4px;margin-bottom:8px;transition:.3s ease;text-decoration:none;color:var(--text-color)}.profile-sub-btn{background-color:var(--detail-color);color:#f5f5f5}.settings-sub-btn{background-color:var(--input-bg);color:var(--text-color)}.profile-sub-btn:hover,.settings-sub-btn:hover{box-shadow:0 6px 8px var(--shadow);transform:translateY(-2px)}.profile-sub-btn:active,.settings-sub-btn:active{box-shadow:none;transform:translateY(0)}.profile-sub-btn:last-child,.settings-sub-btn:last-child{border-bottom:none}.slide-message{min-width:250px;padding:20px;color:#fff;text-align:center;border-radius:20px;position:fixed;z-index:9999;left:50%;top:30px;font-family:Roboto,sans-serif;transform:translate(-50%) translateY(-20px);background-color:var(--slide-message-bg);box-shadow:0 10px 20px #0003;opacity:0;align-items:center;visibility:hidden;justify-content:center;gap:10px;transition:opacity .3s ease,visibility .3s ease}.slide-message.show{visibility:visible;opacity:1;transform:translate(-50%) translateY(0);transition:opacity .3s ease,transform .3s ease,visibility .3s ease}.loading-indicator{position:absolute;margin-top:50px;top:50%;left:50%;transform:translate(-50%,-50%);display:inline-block;width:25px;height:25px;margin-left:20px;background-color:#1e90ff;border-radius:50%}.loader-blink{display:block;width:25px;height:25px;background-color:#416caa;opacity:.7;border-radius:50%;animation:blink .3s linear infinite}.online-indicator{position:absolute;bottom:5px;right:5px;display:inline-block;width:15px;height:15px;margin-right:10px;background-color:#0fcc45;border-radius:50%}.blink{display:block;width:15px;height:15px;background-color:#0fcc45;opacity:.7;border-radius:50%;animation:blink 3s linear infinite}.skeleton{animation:shimmer 2s infinite linear;background:linear-gradient(to right,#eee 8%,#ddd 18%,#eee 33%);background-size:1000px 100%}@media (max-width: 800px){header{padding:0 2%;justify-content:center}.logo{margin-right:.5rem}nav a{font-size:1.2rem;margin-bottom:10px}}.login-wrapper{flex-grow:1;display:flex;justify-content:center;align-items:center;padding:0 1rem}.login-container{max-width:500px;width:100%;padding:2rem;background-color:var(--input-bg);box-shadow:0 2px 4px var(--shadow);border-radius:5px;transition:all .3s ease}.btn-login{margin-left:.5rem}.login-wrapper{margin-top:200px;flex-grow:1;display:flex;justify-content:center;align-items:center;padding:0 1rem}.login-container:hover{box-shadow:0 4px 8px var(--shadow);transform:translateY(-2px)}@media (max-width: 1200px){.login-container{max-width:60%}}@media (max-width: 992px){.login-container{max-width:70%}}@media (max-width: 768px){.login-container{max-width:90%}}form input[type=text],form input[type=email],form input[type=password]{font-family:Roboto,sans-serif;font-size:16px;padding:8px;border:1px solid var(--border-color);border-radius:10px;width:100%;background-color:var(--post-search-bg);box-sizing:border-box;outline:none;transition:border-color .3s}#username,#password{color:var(--text-color)}form input[type=text]:focus,form input[type=email]:focus,form input[type=password]:focus{border-color:var(--border-color)}form input[type=submit]{background-color:var(--btn-hover);color:#f0f0f0;padding:.5rem 1rem;border-radius:20px;font-size:1rem;cursor:pointer;transition:background-color .3s ease,box-shadow .3s ease,transform .3s ease;border:none;width:100%;margin-top:1rem}form input[type=submit]:hover{background-color:var(--btn-hover);box-shadow:0 4px 10px var(--shadow);transform:translateY(-2px)}form input[type=submit]:active{background-color:var(--btn-focus);box-shadow:none;transform:translateY(0)}.login-container{max-width:400px;padding:2rem;border-radius:10px}.login-container h2{font-size:2rem;text-align:center;margin-bottom:1.5rem;color:var(--highlight-color);font-weight:600}form label{font-size:18px;font-weight:700;margin-bottom:.25rem;display:block}.signup-wrapper{margin-top:150px;flex-grow:1;display:flex;justify-content:center;align-items:center;padding:0 1rem}.signup-container{max-width:50%;width:100%;padding:2rem;background-color:var(--input-bg);border:1px solid var(--border-color);border-radius:10px;box-shadow:0 2px 4px #0000001a;transition:all .3s ease}.signup-container:hover{box-shadow:0 4px 8px var(--shadow);transform:translateY(-2px)}@media (max-width: 1200px){.signup-container{max-width:60%}}@media (max-width: 992px){.signup-container{max-width:70%}}@media (max-width: 768px){.signup-container{max-width:90%}}form input[type=text],form input[type=email],form input[type=password]{color:var(--text-color);font-family:Roboto,sans-serif;font-size:16px;padding:8px;border:1px solid var(--border-color);border-radius:10px;width:100%;background-color:var(--post-search-bg);box-sizing:border-box;outline:none;transition:border-color .3s}form input[type=text]:focus,form input[type=email]:focus,form input[type=password]:focus{border-color:var(--highlight-color);background-color:var(--post-search-bg)}form input[type=submit]{background-color:var(--btn-color);color:#f0f0f0;padding:.5rem 1rem;border-radius:20px;font-size:1rem;cursor:pointer;transition:background-color .3s ease,box-shadow .3s ease,transform .3s ease;border:none;width:100%;margin-top:1rem}form input[type=submit]:hover{background-color:var(--btn-hover);box-shadow:0 4px 10px #0003;transform:translateY(-2px)}form input[type=submit]:active{background-color:var(--btn-hover);box-shadow:none;transform:translateY(0)}.signup-container{max-width:400px;padding:2rem;background-color:var(--post-search-bg);box-shadow:0 2px 4px var(--shadow);border-radius:10px}.signup-container h2{font-size:2rem;text-align:center;margin-bottom:1.5rem;color:var(--highlight-color);font-weight:600}form{display:flex;flex-direction:column}form div{margin-bottom:1rem}form label{color:var(--text-color);font-size:18px;font-weight:700;margin-bottom:.25rem;display:block}.container{display:flex}.add-post-btn{font-size:2rem;display:flex;align-items:center;justify-content:center;width:80px;height:80px;background-color:var(--detail-color);color:#f0f0f0;border-radius:50%;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 4px #0000001a;border:none;outline:none;position:fixed;bottom:50px;left:50px;transform:none;z-index:8000}.add-post-btn:hover{background-color:var(--detail-color);box-shadow:0 4px 8px #0000001a;transform:translateY(-2px)}.center-content{margin-left:15%;margin-right:5%;padding:1rem;width:60%}.search-bar{display:flex;flex-wrap:wrap;align-items:center;margin-bottom:25px}.dropdown{position:relative;display:inline-block;padding:.5rem 1rem;border-radius:10px;cursor:pointer;background-color:var(--header-btn);box-shadow:0 2px 4px var(--shadow);transition:.3s ease;color:var(--text-color);font-size:1rem;border:none;outline:transparent;text-align:center;z-index:6000}.dropdown-title{font-weight:700;text-align:center;user-select:none}.dropdown-title span{display:inline-block;transform:rotate(-45deg);transition:transform .3s ease}.dropdown:hover{box-shadow:0 4px 8px var(--shadow);transform:translateY(-2px)}.dropdown:active{box-shadow:none;transform:translateY(0)}.dropdown-options{position:absolute;top:100%;left:50%;transform:translate(-50%);width:200px;background-color:var(--header-btn);border:1px solid #ccc;border-radius:6px;padding:15px;box-shadow:0 6px 12px #00000026;max-height:400px;overflow-y:auto;visibility:hidden;opacity:0;transition:.2s ease;list-style-type:none;z-index:6000}.dropdown-options.show{opacity:1;visibility:visible}.dropdown-options li{padding:12px;border-bottom:1px solid var(--border-color);background-color:var(--notification-item);border-radius:4px;margin-bottom:8px;transition:.2s ease;user-select:none}.dropdown-options li:hover{box-shadow:0 4px 10px var(--shadow);transform:translateY(-2px)}.dropdown-options li:last-child{border-bottom:none}.filter-btn{position:relative;display:inline-block;padding:.5rem 1rem;border-radius:10px;cursor:pointer;background-color:var(--header-btn);box-shadow:0 2px 4px var(--shadow);transition:.3s ease;color:var(--text-color);font-size:1rem;border:none;outline:transparent;text-align:center;z-index:6002;user-select:none;margin:8px}.filter-btn:hover{box-shadow:0 4px 8px var(--shadow);transform:translateY(-2px)}.filter-btn:active{box-shadow:none;transform:translateY(0)}.filter-category{text-align:center;font-weight:700;background-color:var(--notification-item);padding:.75rem .5rem;border-radius:6px;color:var(--text-color);box-shadow:0 2px 4px var(--shadow);width:100%;transition:.2s ease;font-size:1.2rem}.filter-category:hover{box-shadow:0 4px 8px var(--shadow);transform:translateY(-2px)}.filter-panel{cursor:default;margin-top:20px;display:flex;flex-wrap:wrap;justify-content:start;width:300px;align-items:center;gap:5px;position:absolute;top:100%;left:50%;transform:translate(-50%);background-color:var(--header-btn);border:1px solid #ccc;border-radius:10px;padding:15px;box-shadow:0 6px 12px #00000026;max-height:250px;overflow-y:auto;transition:.2s ease;list-style-type:none;z-index:7002;visibility:hidden;opacity:0}.filter-panel.show{opacity:1;visibility:visible}.filter-option{padding:1px;font-size:.5rem;border-bottom:1px solid var(--border-color);background-color:var(--notification-item);border-radius:5px;cursor:pointer;white-space:nowrap;transition:.2s ease;user-select:none}.filter-option:hover{box-shadow:0 4px 10px var(--shadow);transform:translateY(-2px)}.filter-option:last-child{border-bottom:none}@media (min-width: 1000px){.center-content{width:600px}}.modal{position:fixed;z-index:8300;left:0;top:0;width:100%;height:100%;background-color:var(--overlay-bg);transition:all .3s ease}.modal-content{background:var(--post-color);margin:8% auto;padding:20px;border-radius:10px;width:80%;max-width:500px;box-shadow:0 0 10px var(--shadow);transition:all .3s ease}.modal-header{padding-bottom:10px;border-bottom:1px solid var(--border-color)}.modal-header h2{color:var(--post-title-color)}.modal-body{padding-top:10px}#postForm input[type=text],#postForm textarea{width:100%;padding:1rem;font-size:1.1rem;border:1px solid var(--border-color);border-radius:5px;outline:none;margin-bottom:1.5rem;box-sizing:border-box;background-color:var(--input-bg);transition:all .3s ease;resize:none;color:var(--text-color)}#postForm p{color:var(--text-color)}#postForm input[type=text]:focus,#postForm textarea:focus{border-color:var(--detail-color);box-shadow:0 0 5px var(--highlight-color)}#postForm input[type=submit]{margin-bottom:1.5rem;background-color:var(--btn-color);color:var(--text-color);border:none;padding:1rem 2rem;font-size:1.1rem;border-radius:50px;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 4px var(--shadow)}#postForm input[type=submit]:hover{background-color:var(--btn-hover);transform:translateY(-2px);box-shadow:0 4px 8px var(--shadow)}#postForm input[type=submit]:active{transform:translateY(0)}.overlay{position:fixed;top:0;left:0;width:100%;height:100%;z-index:3000}.games-panel{display:flex;flex-direction:column;align-items:center;gap:2rem;margin-top:75px;margin-right:10px}.game-item{background-color:var(--background);border:1px solid var(--text-color);border-radius:10px;padding:1.5rem;width:100%;box-shadow:0 2px 4px var(--shadow);transition:all .3s ease;box-sizing:border-box;max-width:100%}.game-item:hover{box-shadow:0 6px 8px var(--shadow);transform:translateY(-2px)}.chess-game{background-color:var(--chess-panel);border-color:var(--border-color)}.trivia-game{background-color:var(--trivia-panel);border-color:var(--border-color)}.puzzle-game{background-color:var(--puzzle-panel);border-color:var(--border-color)}.game-title{margin-top:0;margin-bottom:.5rem;font-size:1.4rem;color:#f0f0f0}.game-description{word-break:break-word;margin-bottom:0;font-size:1rem;color:#fff;line-height:1.5}.game-meta{display:flex;justify-content:space-between;margin-top:.5rem;font-size:.9rem;color:#f5f5f5}.game-meta .players{font-weight:700;color:#f5f5f5}.game-join-btn{display:inline-block;padding:.5rem 1rem;background-color:var(--detail-color);margin-top:10px;color:#fff;border-radius:50px;font-size:1.5rem;cursor:pointer;transition:all .3s ease;border:none;text-align:center;text-decoration:none;white-space:nowrap}.game-join-btn:hover{background-color:var(--detail-color);box-shadow:0 4px 10px var(--shadow);transform:translateY(-2px)}.game-join-btn:active{background-color:var(--btn-focus);box-shadow:none;transform:translateY(0)}#chess-game .game-join-btn{background-color:var(--chess-join-btn)}#chess-game .game-join-btn:hover{background-color:var(--chess-join-btn-hover)}#trivia-game .game-join-btn{background-color:var(--trivia-join-btn)}#trivia-game .game-join-btn:hover{background-color:var(--trivia-join-btn-hover)}#puzzle-game .game-join-btn{background-color:var(--puzzle-join-btn)}#puzzle-game .game-join-btn:hover{background-color:var(--puzzle-join-btn-hover)}.game-description{max-width:40ch}@media (min-width: 801px){.inbox-panel{width:650px}}@media (max-width: 800px){.game-description,.game-meta{display:none}.inbox-panel{width:400px}.add-post-btn{font-size:1.5rem;bottom:50px;left:10px}}@media (max-width: 600px){.post{padding:1rem}.post h2{font-size:1.5rem}.post p{font-size:1rem}.post-meta{font-size:.8rem}.post-actions{flex-direction:column}.like-btn,.bookmark-btn{margin-bottom:.5rem}.comment-container{flex-direction:column}.comment-btn{margin-left:0;margin-top:.5rem}.game-item{flex:0 0 calc(100% / 3 - 10px);margin:5px;text-align:center}.games-panel{flex-wrap:wrap;width:60%;margin:10px auto;order:-1}.container{flex-direction:column}.center-content{width:60%;margin:10px auto}}@media (max-width: 500px){.inbox-panel{width:85%}.inbox-message-input{padding:.75rem .1rem;font-size:.9rem}.send-message-btn-user{font-size:.9rem}}@media (max-width: 450px){.games-panel,.center-content{width:80%}}.user-container,.profile-container{margin:100px 50px 0;display:flex;justify-content:center;align-items:center}.user-post-container,.profile-post-container{margin:25px auto;border-radius:20px;padding:1rem;width:40%}@media (min-width: 1000px){.user-post-container,.profile-post-container{width:600px}}@media (max-width: 800px){.user-post-container,.profile-post-container{width:70%;margin:10px auto}}@media (max-width: 600px){.container{width:90%;margin:25px auto}.posts{width:90%}}.profile-card,.user-card{background-color:var(--card);box-shadow:0 4px 6px #0000001a;border-radius:10px;padding:20px;width:80%;max-width:800px;display:block;flex-direction:column;gap:20px;align-items:center;text-align:center}.user-emoji,.profile-emoji{position:relative;font-size:5rem;margin-bottom:15px;border-radius:50%;padding:10px;background-color:var(--emoji);box-shadow:0 4px 6px var(--shadow);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.user-info,.profile-info{display:flex;flex-direction:column;gap:10px;align-items:center}.user-name,.profile-name{font-size:48px;font-weight:700;color:var(--detail-color)}@media (max-width: 1000px){.profile-name,.user-name{font-size:30px}}.profile-country,.profile-bio,.profile-category,.user-country,.user-bio,.user-category{font-size:24px}.profile-country,.user-country{color:var(--post-title-color)}.profile-bio,.user-bio{font-size:18px;font-style:italic;margin-top:0;margin-bottom:15px;color:var(--text-color)}.profile-category,.user-category{background-color:var(--detail-color);color:#fff;border-radius:5px;padding:5px 10px;font-weight:700;text-transform:uppercase;letter-spacing:1px;font-size:16px}.followers-count{color:var(--post-highlight-color)}.following-count{color:var(--post-meta-color)}.message-bar{width:100%;padding:1rem;margin-bottom:.5rem;font-size:1rem;border:1px solid var(--border-color);border-radius:20px;outline:none;box-sizing:border-box;transition:all .3s ease;background-color:var(--input-bg);box-shadow:0 4px 8px #0000001a}.message-bar:focus{background-color:var(--input-bg);box-shadow:0 0 5px var(--highlight-color),0 4px 8px var(--shadow);transform:translateY(-2px)}.send-message-btn-user{display:inline-flex;align-items:center;justify-content:center;background-color:var(--btn-color);width:100%;color:var(--text-color);padding:1rem;margin-bottom:.5rem;font-size:1rem;border:none;border-radius:20px;outline:none;box-sizing:border-box;transition:all .3s ease;cursor:pointer;box-shadow:0 4px 8px var(--shadow)}.send-message-btn-user:before{content:"✉️";margin-right:.5rem}.send-message-btn-user:hover{background-color:var(--btn-hover);box-shadow:0 6px 10px var(--shadow);transform:translateY(-2px)}.send-message-btn-user:active{background-color:var(--btn-focus);box-shadow:none;transform:translateY(0)}.followers-following{display:flex;gap:10px;font-size:16px;font-weight:700;color:var(--text-color);margin-bottom:20px}.follow-btn{background-color:var(--detail-color);border:none;border-radius:5px;color:#f5f5f5;cursor:pointer;font-size:16px;font-weight:700;padding:10px 20px;text-transform:uppercase;transition:.3s;box-shadow:0 2px 4px var(--shadow);margin-bottom:20px}.follow-btn:hover{background-color:var(--detail-color);box-shadow:0 4px 8px var(--shadow);transform:translateY(-2px)}.follow-btn:active{background-color:var(--detail-color);box-shadow:none;transform:translateY(0)}.post-wrapper{position:relative}.post{background-color:var(--post-color);border:1px solid var(--border-color);border-radius:10px;padding:2rem;margin-bottom:1rem;box-shadow:0 2px 4px var(--shadow);transition:all .3s ease}.post-container{opacity:1;visibility:visible;transition:.2s ease;min-height:800px}.post-container.hide{opacity:0;visibility:hidden}.post:hover{box-shadow:0 6px 8px var(--shadow);transform:translateY(-2px)}.post h2{margin-top:0;margin-bottom:.5rem;font-size:1.4rem;color:var(--post-title-color)}.post p{word-break:break-word;margin-bottom:0;font-size:1rem;color:var(--post-text-color);line-height:1.5}.post-meta{display:flex;justify-content:space-between;margin-top:.5rem;font-size:.9rem;color:var(--post-meta-color)}.post-meta .date{font-weight:700;color:var(--post-meta-date-color)}.post-actions{display:flex;justify-content:space-between;margin-top:1rem}.post-stats{font-size:.9rem;color:var(--post-meta-color)}.like-count{margin-left:.4rem;font-weight:700}.like-btn-active{background-color:var(--liked-btn-bg)}.like-btn-inactive{background-color:var(--detail-color)}.bookmark-btn-active{background-color:var(--bookmarked-btn-bg)}.bookmark-btn-inactive{background-color:var(--detail-color)}.category{display:inline-block;padding:5px 10px;background-color:#282a36;font-weight:700;border-radius:15px;color:#fff;position:relative;margin:5px 0;font-size:.85em;transition:.3s ease;cursor:pointer;user-select:none}.category:hover{box-shadow:0 4px 10px #0003;transform:translateY(-2px);color:#f5f5f5}.category:active{box-shadow:none;transform:translateY(0)}.category.technology{background-color:#84b3f5e6;color:#1a7fe3}.category.travel{background-color:#90ee90e6;color:#32cd32}.category.food{background-color:#ffe090e6;color:orange}.category.fashion{background-color:#ee90eee6;color:orchid}.category.sports{background-color:#fff0d7e6;color:#d2a659}.category.health{background-color:#90eeb2e6;color:#3cb371}.category.beauty{background-color:#ff90c0e6;color:#ff1493}.category.music{background-color:#ffb390e6;color:tomato}.category.gaming{background-color:#c690eee6;color:#8a2be2}.category.animals{background-color:#90ffb2e6;color:#0fcc45}.category.finance{background-color:#90eee0e6;color:#066}.category.education{background-color:#eecf90e6;color:#960}.category.art{background-color:#ee90ade6;color:#603}.category.politics{background-color:#eeee90e6;color:#660}.category.science{background-color:#90a7eee6;color:#036}.category.environment{background-color:#90eea7e6;color:#363}.category.literature{background-color:#ee90aae6;color:#c06}.category.business{background-color:#ffa390e6;color:#f33}.category.entertainment{background-color:#eeb990e6;color:#c60}.category.history{background-color:#a390eee6;color:#306}.category.miscellaneous{background-color:#eee0cae6;color:#8b4513}.category.cars{background-color:#8c8280e6;color:#8b4513}.category.philosophy{background-color:#ebe2aee6;color:#daa520}.category.photography{background-color:#aec6cfe6;color:#2f4f4f}.category.movies{background-color:#778899e6;color:navy}.category.home-and-garden{background-color:#98fb98e6;color:#006400}.category.career{background-color:#dda0dde6;color:#8a2be2}.category.relationships{background-color:#ff69b4e6;color:#c71585}.category.society{background-color:#ff6347e6;color:#b22222}.category.parenting{background-color:#f0e68ce6;color:#daa520}.category.space{background-color:#87ceebe6;color:#00008b}.category.diy{background-color:#32cd32e6;color:green}.category.cooking{background-color:#fa8072e6;color:#8b0000}.category.adventure{background-color:#90ee90e6;color:#006400}.category.spirituality{background-color:#ee82eee6;color:#8a2be2}.category.fitness{background-color:#6495ede6;color:navy}.category.real-estate{background-color:#f4a460e6;color:#8b4513}.category.psychology{background-color:#dddddde6;color:gray}.category.personal-finance{background-color:#d2b48ce6;color:#8b4513}.category.hobbies{background-color:#ff8c00e6;color:#b22222}.category.current-events{background-color:#b0e0e6e6;color:#2f4f4f}.author{color:var(--post-title-color);font-size:1.2rem;font-weight:700;text-decoration:none;cursor:pointer;transition:color .3s ease,text-shadow .3s ease}.author:hover{color:var(--post-highlight-color);text-shadow:var(--post-highlight-text-shadow)}.like-btn,.bookmark-btn{border:none;color:#fff;padding:.5rem 1rem;border-radius:100px;font-size:1rem;cursor:pointer;transition:background-color .3s ease,box-shadow .3s ease,transform .3s ease}.like-btn:hover,.bookmark-btn:hover{box-shadow:0 4px 10px #0003;transform:translateY(-2px)}.like-btn:active,.bookmark-btn:active{box-shadow:none;transform:translateY(0)}.comment-container{display:flex;justify-content:space-between;align-items:center;margin-top:2rem}.comment-field{flex-grow:1;padding:.75rem;border:none;border-radius:5px;outline:none;transition:all .3s ease;box-shadow:0 2px 4px #0000001a;background-color:var(--input-bg);color:var(--text-color)}.comment-field:focus{box-shadow:0 0 5px #1e90ff80,0 2px 4px #0000001a}.comment-btn{border:none;background-color:var(--detail-color);color:#fff;padding:.5rem 1rem;border-radius:20px;margin-left:.5rem;font-size:.9rem;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 4px #0000001a}.comment-btn:hover{filter:brightness(110%);box-shadow:0 4px 8px #0000001a}.see-comments-container{font-size:.9rem;color:var(--detail-color);cursor:pointer;margin-top:1rem;margin-bottom:1rem;text-decoration:underline;transition:color .3s ease,text-shadow .3s ease}.see-comments-container:hover{color:#64a3ff;cursor:pointer;text-shadow:0 0 5px rgba(100,163,255,.5)}.comments{max-height:300px;overflow-y:auto;margin-top:1rem}.comment{padding:.5rem;border-bottom:1px solid #eee;font-size:.9rem;display:flex;flex-direction:column}.comment:last-child{border-bottom:none}.comment-author{cursor:pointer;font-weight:700;margin-right:.5rem;color:var(--post-meta-color);transition:.3s ease}.comment-text{color:var(--post-text-color);margin-top:.5rem;line-height:1.5}.comment-author:hover{color:var(--detail-color)}.comment-info{display:flex;justify-content:space-between;align-items:center;margin-top:.25rem}.comment-time{color:#888;font-size:.8rem;opacity:.7}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.skeleton{animation:shimmer 2s infinite linear;background:linear-gradient(to right,var(--skeleton-background-1) 8%,var(--skeleton-background-2) 18%,var(--skeleton-background-1) 33%);background-size:1000px 100%}.post.skeleton{background-color:var(--post-skeleton-background);border:1px solid var(--post-skeleton-border);border-radius:10px;padding:2rem;margin-bottom:1rem;transition:all .3s ease}.skeleton-title,.skeleton-body,.skeleton-author,.skeleton-date,.skeleton-interactions,.skeleton-comments{background-color:var(--skeleton-elements);color:transparent;border-radius:4px}.skeleton-title{height:1.4rem;margin-top:0;margin-bottom:.5rem}.skeleton-body{height:1rem;margin-bottom:0;line-height:1.5}.skeleton-author,.skeleton-date,.skeleton-interactions,.skeleton-comments{height:.9rem}.skeleton-author,.skeleton-date{width:50%}.invite-message{top:0;left:0;width:100%;height:100%;background:var(--shadow);display:flex;justify-content:center;align-items:center;animation:fadeIn .5s}.invite-content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:500px;height:200px;background:var(--post-color);padding:20px;border-radius:20px;text-align:center;box-shadow:0 10px 20px var(--shadow);font-family:Roboto,sans-serif;z-index:9999;animation:fadeIn .5s ease-in-out}.invite-game-header{font-size:2rem;color:var(--post-title-color);margin-bottom:10px;margin-top:20px}.invite-content{font-size:1.6rem}.invite-buttons{display:flex;justify-content:space-between;margin:35px 50px}.invite-accept{background:var(--puzzle-panel);color:#f0f0f0;border:none;padding:10px 20px;margin-right:10px;border-radius:20px;cursor:pointer;transition:background-color .3s ease,transform .3s ease;font-weight:700;display:inline-flex;align-items:center;justify-content:center;font-size:1.2rem;animation:bounce 1s infinite}.invite-accept:hover{background:var(--puzzle-join-btn);transform:translateY(-3px);box-shadow:0 4px 10px var(--shadow)}.invite-text{color:var(--text-color)}.invite-decline{background:var(--error-color);color:#fff;border:none;padding:10px 20px;border-radius:20px;cursor:pointer;transition:background-color .3s ease;font-weight:700;display:inline-flex;align-items:center;justify-content:center;font-size:1.2rem}.invite-decline:hover{background:var(--error-color-hover)}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-5px)}60%{transform:translateY(-2px)}}:root{--header: #f0f0f0;--light-header: #f0f0f0;--dark-header: #2d2d2d;--card:#E0E0E0;--card-light:#E0E0E0;--card-dark: #1C1C1C;--header-btn: #f5f5f5;--light-header-btn: #f5f5f5;--dark-header-btn: #3d3d3d;--emoji: #f0f0f0;--light-emoji: #f0f0f0;--dark-emoji: #3d3d3d;--detail-color: #1e90ff;--light-detail-color: #1e90ff;--dark-detail-color: #416caa;--chess-panel: #f1c40f;--light-chess-panel: #f1c40f;--dark-chess-panel: #c6b228;--trivia-panel: #3498db;--light-trivia-panel: #3498db;--dark-trivia-panel: #1f6383;--puzzle-panel: #27ae60;--light-puzzle-panel: #27ae60;--dark-puzzle-panel: #238e48;--background: #ECEFF1;--light-background: #ECEFF1;--dark-background: #101010;--post-color: rgb(224, 224, 224);--post-color-light: rgb(224, 224, 224);--post-color-dark: rgb(28, 28, 28);--logo: #333;--light-logo: #333;--dark-logo: #ddd;--liked-btn-bg: rgb(215, 47, 86);--light-liked-btn-bg: rgb(215, 47, 86);--dark-liked-btn-bg: rgb(170, 45, 75);--bookmarked-btn-bg: rgb(190, 119, 63);--light-bookmarked-btn-bg: rgb(190, 119, 63);--dark-bookmarked-btn-bg: rgb(153, 101, 60);--input-bg: #fafafa;--light-input-bg: #fafafa;--dark-input-bg: #3d3d3d;--text-color: #333333;--light-text-color: #333333;--dark-text-color: #cccccc;--add-post-btn-bg: dodgerblue;--light-add-post-btn-bg: #64a3ff;--dark-add-post-btn-bg: #133c55;--post-search-bg: #ffffff;--light-post-search-bg: #fdfdfd;--dark-post-search-bg: #3d3d3d;--modal-bg: #f2f2f2;--light-modal-bg: #fbfbfb;--dark-modal-bg: #444;--postForm-input-bg: #f6f6f6;--light-postForm-input-bg: #fbfbfb;--dark-postForm-input-bg: #3d3d3d;--postForm-submit-btn-bg: #1e90ff;--light-postForm-submit-btn-bg: #64a3ff;--dark-postForm-submit-btn-bg: #133c55;--slide-message-bg: #47e314;--light-slide-message-bg: #47e314;--dark-slide-message-bg: #41bd18;--inbox-panel-bg: #f5f5f5;--light-inbox-panel-bg: #fafafa;--dark-inbox-panel-bg: #303030;--inbox-search-bg: #f0f0f0;--light-inbox-search-bg: #fafafa;--dark-inbox-search-bg: #3d3d3d;--overlay-bg: rgba(0, 0, 0, .5);--light-overlay-bg: rgba(0, 0, 0, .6);--dark-overlay-bg: rgba(0, 0, 0, .4);--post-title-color: #333333;--light-post-title-color: #333333;--dark-post-title-color: #cccccc;--post-text-color: #333;--light-post-text-color: #333;--dark-post-text-color: #a4a4a4;--notification-item: #e8e8e8;--notification-item-light: #e8e8e8;--notification-item-dark: #525252;--notification-unread: #f6b1b1;--notification-unread-light: #f6b1b1;--notification-unread-dark: #d58888;--post-meta-color: #262626;--light-post-meta-color: #262626;--dark-post-meta-color: #9b9b9b;--post-meta-date-color: #333333;--light-post-meta-date-color: #333333;--dark-post-meta-date-color: #bbbbbb;--post-highlight-color: #77b6f1;--light-post-highlight-color: #77b6f1;--dark-post-highlight-color: #77b6f1;--post-highlight-text-shadow: 0 0 5px rgba(100, 163, 255, .5);--light-post-highlight-text-shadow: 0 0 5px rgba(100, 163, 255, .5);--dark-post-highlight-text-shadow: 0 0 5px rgba(100, 163, 255, .5);--btn-hover: rgba(30, 144, 255, .8);--light-btn-hover: rgba(30, 144, 255, .8);--dark-btn-hover: rgba(65, 108, 170, .8);--btn-focus: #d0d0d0;--light-btn-focus: #d0d0d0;--dark-btn-focus: #5d5d5d;--input-hover: #e6e6e6;--light-input-hover: #e6e6e6;--dark-input-hover: #4d4d4d;--input-focus: #d9d9d9;--light-input-focus: #d9d9d9;--dark-input-focus: #5d5d5d;--highlight-color: #1e90ff;--highlight-color-light: #1e90ff;--highlight-color-dark: #416caa;--shadow: rgba(0, 0, 0, .1);--shadow-light: rgba(0, 0, 0, .1);--shadow-dark: rgba(0, 0, 0, .8);--border-color: #ccc;--border-color-light: #ccc;--border-color-dark: #333;--btn-color: #1e90ff;--btn-color-light: #1e90ff;--btn-color-dark: #416caa;--chess-join-btn: #e67e22;--chess-join-btn-light: #e67e22;--chess-join-btn-dark: #d35400;--chess-join-btn-hover: #d35400;--chess-join-btn-hover-light: #d35400;--chess-join-btn-hover-dark: #a04000;--trivia-join-btn: #085a91;--trivia-join-btn-light: #085a91;--trivia-join-btn-dark: #084a77;--trivia-join-btn-hover: #084a77;--trivia-join-btn-hover-light: #084a77;--trivia-join-btn-hover-dark: #063b5a;--puzzle-join-btn: #0c7235;--puzzle-join-btn-light: #0c7235;--puzzle-join-btn-dark: #08602b;--puzzle-join-btn-hover: #08602b;--puzzle-join-btn-hover-light: #08602b;--puzzle-join-btn-hover-dark: #06481d;--error-color: #f37d76;--error-color-light: #f37d76;--error-color-dark: #c05452;--error-color-hover: #ff4d4d;--error-color-hover-light: #ff3333;--error-color-hover-dark: #843534;--light-tile: #EAE9D2;--light-tile-light:#EAE9D2;--light-tile-dark: #7A8593;--dark-tile: #4B7399;--dark-tile-light: #4B7399;--dark-tile-dark: #2D3541;--chess-border: #3a4e67;--chess-border-light: #3a4e67;--chess-border-dark: #20262d;--skeleton-background-1: #eee;--skeleton-background-1-light: #eee;--skeleton-background-1-dark: #222;--skeleton-background-2: #ddd;--skeleton-background-2-light: #ddd;--skeleton-background-2-dark: #333;--post-skeleton-background: #eee;--post-skeleton-background-light: #eee;--post-skeleton-background-dark: #333;--post-skeleton-border: #ddd;--post-skeleton-border-light: #ddd;--post-skeleton-border-dark: #222;--skeleton-elements: #ddd;--skeleton-elements-light: #ddd;--skeleton-elements-dark: #222}.user-online-indicator{position:absolute;bottom:5px;right:5px;display:inline-block;width:15px;height:15px;margin-right:10px;background-color:#0fcc45;border-radius:50%}.chat-app{display:flex;height:100vh}.inbox-panel{border-right:1px solid var(--border-color);background-color:var(--background);width:40%;top:0;left:0;overflow-y:auto;transition:all .3s ease;z-index:1000;padding:1rem;box-sizing:border-box;display:none;box-shadow:-6px 0 12px var(--shadow)}.inbox-search{width:100%;padding:.5rem;margin-bottom:1rem;font-size:1rem;border:none;border-radius:5px;outline:none;box-sizing:border-box;background-color:var(--inbox-search-bg);box-shadow:0 2px 4px var(--shadow);transition:all .3s ease}.inbox-search:focus{box-shadow:0 0 5px var(--highlight-color),0 2px 4px var(--shadow)}.overlay{position:fixed;top:0;left:0;width:100%;height:100%;z-index:5500}.inbox-item{display:flex;flex-direction:column;border-radius:5px;padding:1rem;margin-bottom:.5rem;background-color:var(--inbox-panel-bg);cursor:pointer;box-shadow:0 2px 4px var(--shadow);transition:all .3s ease}.inbox-item:hover{box-shadow:0 4px 8px var(--shadow);transform:translateY(-2px)}.inbox-item:active{box-shadow:none;transform:translateY(0)}.inbox-user{font-weight:700;margin-bottom:.5rem;color:var(--detail-color)}.inbox-last-message{font-size:.9rem;color:var(--text-color);margin-bottom:.5rem}.inbox-timestamp{font-size:.8rem;color:#aaa}.inbox-last-message,.message-log-username,.message{color:var(--text-color)}.inbox-timestamp,.message-time{color:var(--dark-text-color)}.message-log{display:none;flex-grow:1;flex-direction:column;background-color:var(--background);box-shadow:-6px 0 12px var(--shadow)}.message-log.show{display:block}.message-log-header{display:flex;align-items:center;justify-content:space-between;padding:1rem;margin-bottom:1rem;border-bottom:1px solid var(--border-color)}.message-log-username{margin:0;font-size:1.2rem;font-weight:700;color:var(--text-color)}.spacer{flex-grow:1}.message-log-content{display:flex;flex-direction:column;flex-grow:1;min-height:500px;max-height:650px;padding:1rem;overflow-y:auto;background-color:var(--background);box-sizing:border-box}.message{margin-bottom:1rem;font-size:.9rem;line-height:1.5;color:var(--text-color);border:none}.message-content{display:inline-block;padding:8px;border-radius:12px;color:#fff;box-shadow:0 2px 4px var(--shadow);max-width:60%}.message-time{display:inline-block;margin-left:10px;font-size:.8rem;color:#e8e8e880}.message.sent{text-align:right}.message.received{text-align:left}.message.sent .message-content{background-color:var(--highlight-color)}.message.received .message-content{background-color:#a8a8a8}.message.sent,.message.received{margin-bottom:10px}.message-log-input{display:flex;align-items:center;padding:1rem;border-top:1px solid var(--border-color);background-color:var(--background);position:relative}.inbox-message-input{flex-grow:1;margin-right:10px;padding:.75rem 1rem;font-size:1.1rem;font-weight:500;border:none;border-radius:10px;outline:none;box-sizing:border-box;background-color:var(--input-bg);color:var(--text-color);box-shadow:0 2px 4px var(--shadow);transition:all .3s ease}.inbox-message-input:focus{border:none;box-shadow:0 0 5px var(--highlight-color),0 2px 4px var(--shadow)}.send-message-btn{display:inline-block;padding:.75rem 1rem;font-size:1.1rem;font-weight:500;color:#f5f5f5;text-decoration:none;border-radius:8px;background-color:var(--header-btn);border:none;box-shadow:0 2px 4px var(--shadow);transition:all .5s ease;cursor:pointer}.send-message-btn:hover{background-color:var(--btn-hover);box-shadow:0 4px 10px #0003;transform:translateY(-2px)}.send-message-btn:active{box-shadow:none;transform:translateY(0)}.back-btn,.send-message-btn{background-color:var(--btn-color)}.inbox-manage{display:flex;margin-bottom:10px}.add-inbox{display:inline-block;margin-left:1rem;padding:.5rem 1rem;font-size:1.4rem;font-weight:500;color:var(--text-color);text-decoration:none;border-radius:8px;background-color:var(--header-btn);outline:transparent;border:none;box-shadow:0 2px 4px var(--shadow);transition:all .2s ease;cursor:pointer}.add-inbox:hover{color:#0080ff;box-shadow:0 4px 8px var(--shadow);transform:translateY(-2px)}.add-inbox:active{box-shadow:none;transform:translateY(0)}@media (max-width: 700px){.chat-app{flex-direction:column}.inbox-panel{width:100%;height:35%;display:block}.message-log-content{min-height:400px;max-height:500px}.message-log{width:100%;display:block}}::placeholder{color:#aaa;opacity:.5}.profile-card{position:relative}.edit-btn,.cancel-btn{display:none;position:absolute;top:10px;left:10px;align-items:center;justify-content:center;background-color:var(--detail-color);padding:.5rem 1rem;color:#f0f0f0;border:none;border-radius:20px;font-size:1rem;cursor:pointer;transition:background-color .3s ease,transform .3s ease;font-family:Roboto,sans-serif;font-weight:700;box-shadow:0 2px 5px #0003}.save-btn.show,.cancel-btn.show,.edit-btn.show{display:inline-flex}.post-edit-btn,.post-del-btn,.post-save-btn{display:inline-flex;align-items:center;justify-content:center;background-color:var(--detail-color);padding:.5rem 1rem;color:#f0f0f0;border:none;border-radius:20px;font-size:1rem;margin-bottom:5px;cursor:pointer;transition:background-color .3s ease,transform .3s ease;font-family:Roboto,sans-serif;font-weight:700;box-shadow:0 2px 5px #0003}.post-edit-btn:hover,.post-del-btn:hover,.post-save-btn:hover,.save-btn:hover,.edit-btn:hover,.cancel-btn:hover{background-color:var(--btn-hover);transform:translateY(-3px);box-shadow:0 4px 10px var(--shadow)}.post-edit-btn:active,.post-del-btn:active,.post-save-btn:active,.save-btn:active,.edit-btn:active,.cancel-btn:active{background-color:var(--btn-hover);transform:translateY(0);box-shadow:none}.save-btn{display:none;padding:.5rem 1rem;color:#f0f0f0;border:none;border-radius:20px;font-size:1rem;cursor:pointer;transition:background-color .3s ease,transform .3s ease;font-family:Roboto,sans-serif;font-weight:700;box-shadow:0 2px 5px #0003;background-color:#2ecc71;margin-left:auto;margin-right:auto}.save-btn:hover{background-color:#27ae60}.edit-btn{background-color:var(--btn-color)}.edit-btn:hover{background-color:var(--btn-hover)}.cancel-btn{display:none;margin-top:40px;background-color:var(--error-color)}.cancel-btn:hover{background-color:var(--error-color-hover)}.post-del-btn{background-color:#ff6961}.post-del-btn:hover{background-color:#ff4d4d}.post-save-btn{background-color:#2ecc71;margin-left:8px}.post-save-btn:hover{background-color:#27ae60}.profile-bio-edit,.profile-country-edit{font-size:1rem;border:none;border-radius:10px;outline:none;box-sizing:border-box;padding:.5rem;background-color:var(--input-bg);color:var(--text-color);box-shadow:0 2px 4px var(--shadow);transition:all .3s ease;resize:none;width:100%}.profile-bio-edit:focus,.profile-country-edit:focus{border:none;box-shadow:0 0 5px var(--highlight-color),0 2px 4px var(--shadow)}.profile-country-edit{width:40%;margin-bottom:1rem}.profile-bio-edit{width:40%;height:150px}.content-text-area,.title-text-area{font-size:1rem;border:none;border-radius:10px;outline:none;box-sizing:border-box;padding:.5rem;background-color:var(--input-bg);color:var(--text-color);box-shadow:0 2px 4px var(--shadow);transition:all .3s ease;resize:none;width:100%}.content-text-area:focus,.title-text-area:focus{border:none;box-shadow:0 0 5px var(--highlight-color),0 2px 4px var(--shadow)}.title-text-area{margin-bottom:1rem}.content-text-area{height:150px}.theme-switch{position:absolute;top:10px;right:5px;display:flex;gap:10px}.theme-btn{padding:.5rem;border:none;border-radius:50%;font-size:1rem;cursor:pointer;transition:background-color .3s ease,box-shadow .3s ease,transform .3s ease}.theme-btn:hover{box-shadow:0 4px 10px #0003;transform:translateY(-2px)}.theme-btn:active{box-shadow:none;transform:translateY(0)}.light-mode{background-color:#f5f5f5}.light-mode:hover{background-color:#cecece}.dark-mode{background-color:#333}.dark-mode:hover{background-color:#2c2b2b}.light-mode:focus{background-color:#ffc83d}.dark-mode:focus{background-color:#fefcd7}.settings-card{color:var(--text-color);display:flex;border:1px solid gray;border-radius:10px;overflow:hidden;width:60%;min-height:500px;box-shadow:0 2px 4px var(--shadow);margin:0 auto;transition:.3s ease}.settings-card:hover{box-shadow:0 6px 8px var(--shadow);transform:translateY(-2px)}.settings{padding:2rem}.settings-title{color:var(--post-title-color);margin-left:20%;font-size:2rem;font-weight:700}.settings-subtitle{margin-left:20%;font-size:1.2rem;color:gray;margin-bottom:2rem}.settings-card{display:flex;border:1px solid gray;border-radius:10px;overflow:hidden}.settings-options{padding:2rem;border-right:1px solid gray}.settings-option{cursor:pointer;margin-bottom:1rem}.selected-option{font-weight:700}.settings-content{padding:2rem;flex-grow:1}.settings-content h2{font-size:1.4rem;margin-bottom:1rem}.input-group{margin-bottom:1rem;flex:0 0 48%;max-width:300px}.input-group label{font-weight:700;display:block;margin-bottom:.5rem}.input-group input{width:100%;padding:.75rem 1rem;margin-bottom:.5rem;font-size:1.1rem;border:none;border-radius:10px;outline:none;box-sizing:border-box;background-color:var(--post-search-bg);color:var(--text-color);box-shadow:0 2px 4px var(--shadow);transition:.3s ease}.input-group input:hover{transform:translateY(-2px);box-shadow:0 4px 6px var(--shadow)}.input-group input:focus{box-shadow:0 0 5px var(--highlight-color),0 2px 4px var(--shadow);color:var(--post-text-color);outline:none}.account-content{display:flex;justify-content:space-between}.profile-info{flex:1;margin-right:2rem}.input-fields{flex:2}.profile-emoji{cursor:pointer;transition:.3s ease}.profile-emoji:hover,.save-btn-settings:hover,.cancel-btn-settings:hover{box-shadow:0 4px 8px var(--shadow);transform:translateY(-2px)}.profile-emoji:active,.save-btn-settings:active,.cancel-btn-settings:active{box-shadow:none;transform:translateY(0)}.theme-switch-settings{display:flex;gap:10px}.save-btn-settings,.cancel-btn-settings{display:inline-flex;align-items:center;justify-content:center;padding:.5rem 1rem;color:#f0f0f0;border:none;border-radius:20px;font-size:1rem;margin-bottom:5px;cursor:pointer;transition:background-color .3s ease,transform .3s ease;font-family:Roboto,sans-serif;font-weight:700;box-shadow:0 2px 5px #0003}.cancel-btn-settings{background-color:#fa688a;margin-right:10px}.save-btn-settings{background-color:#00d26a}.confirm-delete-container{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--overlay-bg);display:flex;justify-content:center;z-index:9999;align-items:center;animation:fadeIn .5s}.confirm-delete-popup{width:400px;background:var(--background);padding:20px;border-radius:20px;text-align:center;box-shadow:0 10px 20px var(--overlay-bg);font-family:Roboto,sans-serif;animation:slideUp .5s}.confirm-delete-popup h3{font-size:1.5rem;margin-top:0;color:var(--text-color)}.confirm-delete-popup-buttons{display:flex;justify-content:space-between;margin-top:20px}.confirm-delete-popup-buttons button{border:none;padding:.5rem 1rem;border-radius:8px;cursor:pointer;transition:.3s ease;font-weight:700;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 2px 4px var(--shadow);font-size:1.2rem}.confirm-delete-popup-buttons button:hover{box-shadow:0 4px 8px var(--shadow);transform:translateY(-2px)}.confirm-delete-popup-buttons button:active{box-shadow:none;transform:translateY(0)}.confirm-delete-popup-buttons .cancel-popup-btn{background:var(--header);color:var(--text-color)}.confirm-delete-popup-buttons .delete-btn{background:var(--error-color);color:#f5f5f5}.confirm-delete-popup-buttons .delete-btn:before{font-size:1.2rem;margin-right:.5rem}.exit-buttons{display:flex;flex-direction:column}.logout-btn,.delete-account-btn{margin-top:20px;cursor:pointer;border:none;display:inline-block;padding:.25rem .5rem;font-size:1rem;font-weight:500;color:var(--text-color);text-decoration:none;border-radius:8px;background-color:var(--header-btn);box-shadow:0 2px 4px var(--shadow);transition:all .5s ease}.logout-btn:hover,.delete-account-btn:hover{box-shadow:0 4px 8px var(--shadow);transform:translateY(-2px)}.logout-btn:active,.delete-account-btn:active{box-shadow:none;transform:translateY(0)}.delete-account-btn{background-color:var(--error-color);color:#f5f5f5}@media (max-width: 900px){.settings-card{width:90%}.settings-title,.settings-subtitle{margin-left:5%}.input-group{flex:0 0 100%;max-width:100%}.account-content{display:block}.profile-info{margin-bottom:2rem;margin-right:0}.input-fields{margin-top:2rem}.settings-options{padding:.2rem;border-right:1px solid gray}}.content{display:flex;justify-content:space-between;width:100%;max-width:1000px;margin:50px auto 0}.chess-board{display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);width:70vh;height:70vh;margin-right:50px}.tile{cursor:default;display:flex;border:1px solid var(--chess-border);align-items:center;justify-content:center}img{width:52px;height:auto}.friends-panel{background-color:var(--chess-border);width:400px;font-size:1.4rem;border-radius:15px;padding:20px;box-shadow:0 10px 20px #0003;font-family:Roboto,sans-serif;min-width:300px;margin:20px auto;transition:all .2s ease}.friends-panel:hover{transform:translateY(-5px)}.friends-search{width:100%;padding:10px;margin-bottom:20px;font-size:1em;border:none;border-radius:15px;background-color:var(--post-search-bg);box-shadow:0 5px 10px var(--shadow)}.friends-list{border:none;height:300px;overflow-y:auto;border-radius:15px;box-shadow:0 10px 20px var(--shadow);background-color:var(--dark-tile);overflow-x:hidden}.friend-item{display:flex;justify-content:space-between;align-items:center;padding:10px;border-bottom:1px solid var(--light-tile);color:var(--text-color);transition:all .2s ease}.friend-item:hover{background-color:var(--input-hover);transform:scale(1.02)}.online-indicator{display:inline-block;width:12px;height:12px;margin-left:20px;background-color:#0fcc45;border-radius:50%;position:relative}.blink{display:block;width:12px;height:12px;background-color:#0fcc45;opacity:.7;border-radius:50%;animation:blink 3s linear infinite}@keyframes blink{to{transform:scale(2);opacity:0}}.friend-item .friend-name .online-status{display:inline-block}.invite-btn{padding:10px 20px;background-color:var(--light-tile);color:var(--text-color);border:none;border-radius:50px;cursor:pointer;transition:all .2s ease;box-shadow:0 5px 10px #0000001a}.invite-btn:hover{background-color:var(--btn-hover);transform:scale(1.05);box-shadow:0 10px 20px #0003}.friends-search{padding:.75rem 1rem;margin-bottom:.5rem;font-size:1.1rem;border:none;border-radius:20px;outline:none;box-sizing:border-box;background-color:var(--post-search-bg);color:var(--text-color);box-shadow:0 2px 4px var(--shadow);transition:.3s ease}.friends-search:hover{background-color:var(--input-hover);transform:translateY(-2px);box-shadow:0 4px 6px var(--shadow)}.piece{font-size:3rem}@media (max-width: 1200px){.chess-board{margin:0;width:80vw;height:80vh}img{width:52px;height:auto}.content{flex-direction:column;align-items:center}}@media (max-width: 800px){.chess-board{width:90vw;height:90vw}img{width:48px;height:auto}}@media (max-width: 550px){.chess-board{width:100vw;height:130vw}img{width:32px;height:auto}.tile{font-size:2.2rem}.friends-panel,.friends-search{width:90vw;margin:10px auto}}@media (max-width: 500px){.friends-panel,.friends-search{width:60vw;margin:10px auto}}.player{font-size:1.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;width:auto;padding:20px;box-shadow:0 10px 20px #0000001a;margin:20px auto;font-family:Roboto,sans-serif;background-color:var(--light-tile);border-radius:15px}.player span{font-size:1em;text-align:center}.top-player{order:1}.content{flex-direction:column;align-items:center}.chess-board-live{margin:0;width:80vw;height:80vh;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);order:2;max-width:900px}.bottom-wrapper{order:3;display:flex;justify-content:space-between;align-items:center}.resign-btn{background:#e34444;color:#fff;padding:15px 30px;border:none;border-radius:15px;font-size:1.2rem;cursor:pointer;transition:.3s ease;box-shadow:0 4px 8px var(--shadow);overflow:hidden;margin-left:100px}.resign-btn:hover{transform:translateY(-3px);box-shadow:0 5px 10px #0000001a}.resign-btn:active{transform:translateY(0);box-shadow:none}#resignConfirmationModal{width:100%;height:100%;background:rgba(0,0,0,.5);justify-content:center;align-items:center;animation:fadeIn .5s}#resignConfirmationModal .modal-content{position:relative;width:400px;background:var(--post-color);padding:40px;border-radius:20px;text-align:center;box-shadow:0 10px 20px #0003;font-family:Roboto,sans-serif;font-size:1.5em;font-weight:700;color:var(--text-color);animation:slideUp .5s}.resign-buttons{display:flex;justify-content:space-between;align-items:center;margin-left:25px;margin-right:25px}.resign-buttons button{display:inline-block;border:none;border-radius:8px;cursor:pointer;overflow:hidden;padding:.5rem 1rem;font-size:1.4rem;font-weight:500;color:var(--text-color);text-decoration:none;background-color:var(--header-btn);box-shadow:0 2px 4px var(--shadow);transition:.3s ease}.resign-buttons button:hover{box-shadow:0 4px 8px var(--shadow);transform:translateY(-2px)}.resign-buttons button:active{box-shadow:none;transform:translateY(0)}#resignConfirmationModal .close{position:absolute;top:10px;right:10px;color:#fff;font-size:28px;font-weight:700;cursor:pointer}#resignConfirmationModal .close:hover,#resignConfirmationModal .close:focus{color:#000;text-decoration:none}#gameResultModal{width:100%;height:100%;background:rgba(0,0,0,.5);justify-content:center;align-items:center;animation:fadeIn .5s}.modal-content-chess{position:relative;top:25%;background:var(--post-color);width:400px;margin:8% auto;padding:40px;border-radius:20px;text-align:center;box-shadow:0 10px 20px var(--shadow);font-family:Roboto,sans-serif;font-size:1.5em;color:var(--text-color);animation:slideUp .5s}.close{position:absolute;top:10px;right:10px;color:#fff;font-size:28px;font-weight:700;cursor:pointer}.close:hover,.close:focus{color:#000;text-decoration:none}#gameResultText{margin-top:20px;font-size:2em;font-weight:700;text-shadow:2px 2px rgba(0,0,0,.1)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(20px)}to{transform:translateY(0)}}@media (max-width: 1200px){.chess-board-live{margin:0;width:80vw;height:80vh}img{width:52px;height:auto}}@media (max-width: 800px){.chess-board-live{width:90vw;height:90vw}img{width:48px;height:auto}}@media (max-width: 550px){.chess-board-live{width:100vw;height:130vw}img{width:32px;height:auto}.tile{font-size:2.2rem}}