.container{display:flex;height:100vh;overflow:hidden}.sidebar{flex-shrink:0;justify-content:space-between;padding:15px}.sidebar h2{color:var(--sidbar-title);font-size:20px;margin:0 0 15px}.dm-list{display:flex;flex:1 1;flex-direction:column;gap:12px;overflow:hidden}.dm{cursor:pointer;padding:4px 8px;transition:background .2s}.dm:hover{background:#ffffff1a}.dm img{border-radius:50%;height:40px;width:40px}.dm-avatar{display:inline-block;position:relative}.dm span{font-size:16px}.unread-dot{background-color:#ff3b30;border:2px solid var(--card-bg);border-radius:50%;height:10px;position:absolute;right:0;top:0;width:10px}.dm.unread{background-color:#ff00000d}.bottom-section{flex-direction:column;gap:10px;margin-top:auto}.bottom-section,.settings-btn{align-items:center;display:flex}.settings-btn{background:var(--sidebar-text);border-radius:50%;cursor:pointer;height:50px;justify-content:center;transition:background .2s;width:50px}.settings-btn:hover{background:var(--sidebar-hover)}.settings-btn img{height:24px;width:24px}.user{align-items:center;background:var(--card-bg);border-radius:20px;color:var(--text-main);display:flex;font-size:16px;gap:10px;padding:8px 12px}.user img{border-radius:50%;height:24px;width:24px}.main{background:linear-gradient(180deg,var(--bg-1) 5%,var(--bg-2) 48%,var(--bg-3) 89%);display:flex;flex:1 1;flex-direction:column;padding:20px}.main-header{align-items:center;background:var(--header-bg);border-radius:9px;color:var(--header-text);display:flex;justify-content:space-between;padding:12px 20px}.add-friend{background:var(--accent-1);border:none;border-radius:10px;cursor:pointer;font-size:16px;font-weight:700;padding:8px 12px;transition:background .2s}.add-friend:hover{background:var(--accent-2)}.sign-out-btn{background:var(--accent-1);border:none;border-radius:10px;cursor:pointer;font-size:16px;font-weight:700;padding:8px 12px;transition:background .2s}.sign-out-btn:hover{background:var(--accent-2)}.friends-container{align-items:center;display:flex;flex:1 1;flex-direction:column;gap:12px;margin-top:20px;overflow-x:visible;overflow-y:auto}.friend-card{border-radius:8px;padding:50px 20px;position:relative;transition:transform .15s ease-in-out;width:95%;z-index:1}.friend-card:hover{transform:translateY(-2px);z-index:1000}.friend-card img{border-radius:50%;height:85px;width:85px}.friend-card span{color:#000;flex:1 1;font-size:22px;margin-left:10px}.chat-btn,.options-btn{background:var(--card-bg);border:none;border-radius:50%;cursor:pointer;font-size:20px;height:42px;margin-left:6px;transition:background .2s;width:42px}.chat-btn:hover,.options-btn:hover{background:var(--notif-hover)}.header-right{align-items:center;display:flex;gap:40px}.notif-btn{background:none;border:none;border-radius:50%;cursor:pointer;padding:6px;transition:background-color .3s ease}.notif-btn:hover{background-color:var(--notif-hover)}.notif-btn img{height:24px;width:24px}.notif-dot{background-color:#ff3b30;border:2px solid var(--card-bg);border-radius:50%;height:10px;position:absolute;right:6px;top:4px;width:10px}.notif-container{position:relative}.notif-dropdown{animation:fadeIn .25s ease;background-color:var(--card-bg);border-radius:12px;box-shadow:0 4px 12px #0003;padding:15px;position:absolute;right:0;top:45px;width:250px;z-index:10}.notif-dropdown h3{border-bottom:1px solid var(--notif-highlight);color:var(--text-main);font-size:1.1rem;margin:0 0 10px;padding-bottom:5px}.notif-dropdown li{border-radius:6px;color:var(--text-main);font-size:.95rem;padding:8px 6px;transition:background-color .2s ease}.notif-dropdown li:hover{background-color:var(--notif-highlight)}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.options-wrapper{display:inline-block;position:relative;z-index:1500}.context-menu{background:var(--card-bg);border-radius:10px;box-shadow:0 4px 12px #00000040;display:flex;flex-direction:column;min-width:160px;opacity:0;pointer-events:none;position:absolute;right:0;top:42px;transform:translateY(-5px);transition:opacity .2s ease,transform .2s ease;z-index:9999}.context-menu.show{opacity:1;pointer-events:auto;transform:translateY(0)}.menu-item{background:none;border:none;color:var(--text-main);cursor:pointer;font-size:.95rem;padding:10px 15px;text-align:left;transition:background-color .2s ease}.menu-item:hover{background-color:var(--notif-highlight)}.menu-item.danger{color:#c84848}.menu-item.danger:hover{background-color:#f4b4b4}.context-menu hr{border:none;border-top:1px solid var(--notif-highlight);height:0;margin:5px 0}.friend-requests-container{background-color:#f9f9f9;border-radius:8px;color:#000;padding:20px}.friend-requests-list{list-style:none;padding:0}.friend-request-item{align-items:center;border-bottom:1px solid #eee;display:flex;justify-content:space-between;padding:10px}.friend-request-item img{border-radius:50%;height:50px;width:50px}.request-buttons button{border:none;border-radius:5px;cursor:pointer;margin-left:10px;padding:5px 10px}.accept-btn{background-color:#4caf50;color:#fff}.decline-btn{background-color:#f44336;color:#fff}.messages-container{background:linear-gradient(to bottom,var(--bg-1),var(--bg-2),var(--bg-3));display:flex;font-family:JejuHallasan,sans-serif;height:100vh;overflow:hidden;width:100vw}.sidebar{align-items:center;background:var(--sidebar-bg);color:var(--sidebar-text);display:flex;flex-direction:column;justify-content:flex-start;padding:20px 10px;width:220px}.sidebar h2{font-size:22px;margin-bottom:20px;text-align:center}.sidebar-icons{display:flex;flex-direction:column;gap:25px}.sidebar-icons img{border-radius:50%;cursor:pointer;height:60px;transition:background .3s;width:60px}.sidebar-icons img:hover{background:var(--sidebar-hover)}.create-group{background:var(--accent-1);border:none;border-radius:8px;color:var(--text-main);cursor:pointer;font-size:14px;margin-top:10px;padding:10px;transition:background .3s}.create-group:hover{background:var(--accent-2)}.chat-area{display:flex;flex:1 1;flex-direction:column;padding:15px}.chat-header{align-items:center;background:var(--header-bg);border-radius:6px;color:var(--header-text);display:flex;font-size:20px;gap:12px;margin-bottom:10px;padding:10px 20px}.chat-header-avatar{border:2px solid var(--header-text);border-radius:50%;height:45px;object-fit:cover;width:45px}.chat-body{background:var( --friend-card-bg);border-radius:8px;display:flex;flex:1 1;flex-direction:column;justify-content:flex-start;overflow-y:auto;padding:20px}.message-row{align-items:flex-start;display:flex;gap:10px;margin-bottom:15px;max-width:85%}.message-row.received{align-self:flex-start;flex-direction:row}.message-row.sent{align-self:flex-end;flex-direction:row-reverse}.msg-avatar{border-radius:50%;height:40px;object-fit:cover;width:40px}.message-bubble{background:var(--card-bg);border-radius:14px;display:flex;flex-direction:column;padding:12px 16px;position:relative}.message-row.sent .message-bubble{background:var(--msg-sent-bg);color:var(--msg-sent-text)}.msg-name{color:var(--text-main);font-size:15px;font-weight:700;margin-bottom:3px}.message-row.sent .msg-name{color:var(--msg-sent-name)}.message-text{word-wrap:break-word;color:var(--text-main);font-size:17px;line-height:1.55}.message-row.sent .message-text{color:var(--msg-sent-text)}.input-box{background:var(--header-bg);border-top:3px solid var(--input-border-top);padding:15px 20px}.chat-input input{background:var(--input-bg);border:none;border-radius:25px;color:var(--input-text);flex:1 1;font-size:16px;outline:none;padding:12px 15px}.icon-group{display:flex;gap:10px}.icon-btn{align-items:center;background:none;border:none;border-radius:50%;cursor:pointer;display:flex;height:48px;justify-content:center;transition:transform .2s;width:48px}.icon-btn img{height:auto;max-height:28px;max-width:28px;width:100%}.icon-btn:hover{transform:scale(1.1)}.attach-btn img{filter:brightness(1.2);height:auto;max-height:40px;max-width:40px;width:100%}.send-btn img{background:var(--accent-1);border-radius:50%;padding:22px;transition:background .3s}.send-btn img:hover{background:var(--accent-2)}.chat-body::-webkit-scrollbar{display:none}.messages-back-btn{align-items:center;background:none;border:1px solid #ccc;border-radius:10px;color:#fff;cursor:pointer;display:flex;font-size:1rem;gap:8px;margin-top:40px;padding:12px 28px;transition:all .3s ease;white-space:nowrap;width:fit-content}.messages-back-btn:hover{background:#fff;border:1px solid #ccc;color:#333;transform:scale(.95)}.messages-back-btn img{filter:brightness(1.2);height:10px;transform:rotate(180deg);width:10px}.message-row.sent .msg-time{color:var(--msg-sent-name)}.dm{align-items:center;border-radius:10px;display:flex;gap:10px;padding:8px 6px;width:100%}.dm:hover{background:var(--sidebar-hover)}.dm span{color:var(--sidebar-text);font-size:14px}.unread-count{background:var(--accent-1);border-radius:999px;color:var(--text-main);font-size:12px;padding:4px 8px}.chat-input{align-items:flex-end;background:var(--header-bg);gap:10px}.chat-textarea{background:#fff;border:none;border-radius:20px;color:var(--input-text);flex:0 1 92%;font-size:16px;max-height:140px;min-height:20px;outline:none;overflow:hidden;padding:8px 12px;resize:none}.message-image{border-radius:14px;margin-bottom:8px;max-width:100%;width:260px}.message-input-wrapper{position:relative;width:100%}.chat-input{gap:8px;width:100%}.chat-input,.emoji-btn{align-items:center;display:flex}.emoji-btn{background:#8b5e4a;border:none;border-radius:12px;color:#fff;cursor:pointer;flex-shrink:0;font-size:22px;height:42px;justify-content:center;width:42px}.emoji-picker{grid-gap:8px;background:#5b3b2e;border-radius:16px;bottom:60px;box-shadow:0 6px 18px #00000040;display:grid;gap:8px;grid-template-columns:repeat(4,1fr);left:0;padding:10px;position:absolute;right:0;z-index:1000}.emoji-option{background:#7c5646;border:none;border-radius:12px;cursor:pointer;font-size:24px;padding:10px 0}.message-emoji{font-size:34px;line-height:1;margin-top:4px}@media (max-width:768px){.emoji-btn{font-size:20px;height:40px;width:40px}.emoji-picker{bottom:58px;grid-template-columns:repeat(4,1fr);padding:8px}.emoji-option{font-size:22px;padding:8px 0}}.message-audio{overflow:visible}.big-audio-bubble{border-radius:22px;box-sizing:border-box;margin-top:8px;max-width:420px;min-width:280px;padding:14px 16px;width:100%}.voice-player{display:block;height:54px;min-width:260px;width:100%}.message-row.sent .big-audio-bubble{background:#f0a37a}.message-row.received .big-audio-bubble{background:#5c4b66}.message-bubble{max-width:440px;width:fit-content}.audio-message-bubble{max-width:480px;width:100%}.group-chat-modal-overlay{align-items:center;background:#160c0894;display:flex;inset:0;justify-content:center;padding:24px;position:fixed;z-index:1000}.group-chat-modal{background:#fff7ee;border-radius:24px;box-shadow:0 18px 48px #00000047;color:#3b241a;display:flex;flex-direction:column;max-height:88vh;overflow:hidden;width:min(680px,100%)}.group-chat-modal-header{align-items:flex-start;display:flex;gap:16px;justify-content:space-between;padding:22px 22px 14px}.group-chat-modal-header h2{font-size:26px;margin:0}.group-chat-modal-header p{font-size:14px;margin:6px 0 0;opacity:.78}.group-chat-modal-close{background:#0000;border:none;color:inherit;cursor:pointer;font-size:30px;line-height:1}.group-chat-modal-body{overflow-y:auto;padding:0 22px 20px}.group-chat-modal-label{display:block;font-size:13px;font-weight:700;letter-spacing:.08em;margin-bottom:8px;text-transform:uppercase}.group-chat-modal-input{background:#fff;border:1px solid #ddc6b6;border-radius:16px;color:#3b241a;font-size:15px;margin-bottom:6px;outline:none;padding:12px 14px;width:100%}.group-chat-modal-error{color:#a12f2f;font-size:13px;font-weight:700;margin:0 0 12px}.group-chat-modal-summary{display:flex;font-size:13px;font-weight:700;gap:12px;justify-content:space-between;margin:14px 0 12px}.group-chat-friend-list{grid-gap:10px;display:grid;gap:10px;max-height:320px;min-height:220px;overflow-y:auto;padding-right:4px}.group-chat-friend-card{align-items:center;background:#ffffffe0;border:1px solid #ead4c7;border-radius:18px;cursor:pointer;display:flex;gap:12px;padding:12px 14px}.group-chat-friend-card.selected{background:#f6e2d4;border-color:#b9704d}.group-chat-friend-card input{height:18px;margin:0;width:18px}.group-chat-friend-card img{border-radius:50%;height:42px;object-fit:cover;width:42px}.group-chat-friend-card span{color:#3b241a;font-size:15px}.group-chat-empty-state{color:#8b5a48;font-size:14px;padding:18px 0;text-align:center}.group-chat-modal-actions{border-top:1px solid #8b5a4824;display:flex;gap:10px;justify-content:flex-end;padding:18px 22px 22px}.group-chat-primary-btn,.group-chat-secondary-btn{border:none;border-radius:999px;cursor:pointer;font-size:14px;font-weight:700;padding:11px 18px}.group-chat-secondary-btn{background:#e9d7cb;color:#3b241a}.group-chat-primary-btn{background:#8b4f33;color:#fffaf5}.group-chat-primary-btn:disabled{cursor:not-allowed;opacity:.5}.group-chat-sidebar-section{margin-top:12px;width:100%}.group-chat-sidebar-title{color:var(--sidebar-text);font-size:13px;font-weight:700;letter-spacing:.08em;margin-bottom:8px;text-transform:uppercase}.group-chat-sidebar-list{max-height:180px;overflow-y:auto}.group-chat-sidebar-copy{display:flex;flex-direction:column;min-width:0}.group-chat-sidebar-copy small{color:var(--sidebar-text);font-size:11px;opacity:.8}.chat-header-copy{display:flex;flex-direction:column;gap:2px}.chat-header-copy small{font-size:12px;opacity:.78}.chat-header-row{justify-content:space-between}.delete-group-btn{background:#8f2f2f;border:none;border-radius:999px;color:#fff7f4;cursor:pointer;font-size:13px;font-weight:700;padding:10px 16px;transition:transform .2s,opacity .2s}.delete-group-btn:hover{transform:translateY(-1px)}.delete-group-btn:disabled{cursor:not-allowed;opacity:.55}@media (max-width:768px){.group-chat-modal-overlay{padding:14px}.group-chat-modal{max-height:92vh}.group-chat-modal-actions{flex-direction:column-reverse}.group-chat-primary-btn,.group-chat-secondary-btn{width:100%}.chat-header-row{align-items:flex-start;flex-direction:column}.delete-group-btn{width:100%}}.auth-body{align-items:center;background:linear-gradient(to bottom,var(--bg-1),var(--bg-2),var(--bg-3));display:flex;font-family:Jeju Hallasan,sans-serif;height:100vh;justify-content:center;margin:0}.auth-container{background:var(--card-bg);border-radius:12px;box-shadow:0 4px 10px #0000004d;color:var(--text-main);padding:2rem;text-align:center;width:320px}.auth-container h1{color:var(--text-main);margin-bottom:1.5rem}.auth-container label{color:var(--text-main);display:block;font-weight:700;margin:.5rem 0 .2rem;text-align:left}.auth-container input{background:#fff;border:1px solid #ccc;border-radius:8px;color:#000;margin-bottom:1rem;padding:.6rem;width:100%}.auth-container button{background:var(--btn-primary-bg);border:none;border-radius:8px;color:var(--btn-primary-text);cursor:pointer;font-weight:700;padding:.8rem;transition:background .3s ease;width:100%}.auth-container button:hover{background:var(--btn-primary-hover)}.switch-auth{margin-top:1rem}.switch-auth a{color:var(--btn-secondary-bg);font-weight:700;text-decoration:none}.switch-auth a:hover{text-decoration:underline}body{overflow:hidden}.welcome-container{align-items:center;background:linear-gradient(180deg,var(--bg-1) 5%,var(--bg-2) 48%,var(--bg-3) 89%);display:flex;height:100vh;justify-content:center;position:relative}.welcome-content{color:var(--text-main);position:relative;text-align:center;z-index:3}.welcome-logo{height:150px;margin-bottom:20px;width:150px}h1{font-size:36px;margin-bottom:40px}.button-group{display:flex;gap:20px;justify-content:center}.welcome-btn{border:none;border-radius:8px;cursor:pointer;font-size:18px;font-weight:700;padding:12px 28px;transition:background .3s ease,transform .2s ease}.register{background:var(--btn-secondary-bg);color:var(--btn-secondary-text)}.register:hover{background:var(--btn-secondary-hover)}.login{background:var(--btn-primary-bg);color:var(--btn-primary-text)}.login:hover{background:var(--btn-primary-hover)}body{background:#fff;font-family:Jeju Hallasan,sans-serif;margin:0}:root{--bg-1:#e7c586;--bg-2:#db976a;--bg-3:#c84848;--text-main:#3c2b23;--accent-1:#f4b991;--accent-2:#e0a67c;--card-bg:#fff8f3;--sidebar-bg:#a76554;--sidebar-hover:#7a5c4a;--sidebar-text:#ffd9ba;--header-bg:#4e280c;--header-text:#ffd9ba;--header-border:#3a1e09;--input-bg:#f5cba7;--input-text:#000;--input-border-top:#3a1e09;--sidbar-title:#ddc5b1;--check-gray:#e9e1d6;--check-blue:#1f87ff;--avatar-border:#ffd9ba;--friend-card-bg:#f5cba7;--msg-sent-bg:#db876a;--msg-sent-text:#1d1d1d;--msg-sent-name:#ffd9ba;--msg-received-bg:var(--card-bg);--msg-name-text:var(--text-main);--msg-name-sent-text:var(--msg-sent-name);--card-bg:#fff;--notif-hover:#0000001a;--notif-highlight:#ac0000;--group-button:#e5a485}body.dark{--bg-1:#241829;--bg-2:#2b2438;--bg-3:#744d30;--text-main:#242424;--card-bg:#37382b;--friend-card-bg:#20092f;--sidebar-bg:#3c2b23;--sidebar-hover:#5a3d31;--sidebar-text:#b08a6b;--sidbar-title:#ddc5b1;--header-bg:#242044;--header-text:#ffd9ba;--header-border:#1c0802;--input-bg:#1e1e1e;--input-text:#f5f5f5;--input-border-top:#2a1608;--check-gray:#c7bfb4;--check-blue:#4aa2ff;--msg-sent-bg:#7b2e0a;--msg-sent-text:#fff;--msg-sent-name:#ffd9ba;--msg-received-bg:var(--card-bg);--msg-name-text:var(--text-main);--msg-name-sent-text:var(--msg-sent-name);--notif-hover:#ffffff12;--notif-highlight:#5d4639;--group-button:#7b2e0a}.star-field{display:none;inset:0;pointer-events:none;position:fixed;z-index:1}body.dark .star-field{display:block}.star{animation:twinkle 3s ease-in-out infinite;background:#fff;border-radius:50%;height:2px;opacity:0;position:absolute;width:2px}@keyframes twinkle{0%,to{opacity:.1;transform:scale(.7)}50%{opacity:1;transform:scale(1.3)}}.addfriends-container{align-items:center;background:linear-gradient(180deg,var(--bg-1) 5%,var(--bg-2) 48%,var(--bg-3) 89%);color:var(--text-main);display:flex;flex-direction:column;font-family:Poppins,sans-serif;min-height:100vh;padding:50px 20px}.page-title{color:var(--header-text);font-size:2.2rem;margin-bottom:30px;text-align:center}.search-bar{margin-bottom:30px;max-width:600px;width:80%}.search-bar input{background:var(--input-bg);border:none;border-radius:10px;box-shadow:0 3px 10px #00000040;color:var(--input-text);font-size:1rem;padding:12px 15px;width:100%}.friends-list{display:flex;flex-direction:column;gap:18px;max-width:600px;width:80%}.friend-card{align-items:center;background-color:var(--card-bg);border-radius:12px;box-shadow:0 3px 6px #00000026;display:flex;justify-content:space-between;padding:15px 20px;transition:transform .2s ease}.friend-card:hover{transform:scale(1.02)}.friend-avatar{border:3px solid var(--accent-1);border-radius:50%;height:55px;object-fit:cover;width:55px}.friend-name{color:var(--text-main);flex-grow:1;font-weight:600;margin-left:15px}.add-btn{background-color:var(--group-button);border:none;border-radius:8px;color:#fff;cursor:pointer;padding:8px 14px;transition:background-color .3s ease}.add-btn:hover{background-color:var(--sidebar-hover)}.added-btn{background-color:var(--sidebar-bg);border:none;border-radius:8px;padding:8px 14px}.added-btn,.no-results{color:var(--header-text)}.no-results{font-size:1.1rem;margin-top:20px;text-align:center}.back-btn{background:var(--header-bg);border-radius:18px;box-shadow:0 2px 8px #00000014;color:var(--header-text);font-size:1.12rem;font-weight:500;gap:10px;letter-spacing:.02em;margin-bottom:24px;margin-top:48px;padding:14px 36px;transition:background .2s,transform .2s}.back-btn:hover{background:var(--sidebar-hover);transform:scale(1.04)}.account-container{align-items:center;background:linear-gradient(180deg,var(--bg-1) 5%,var(--bg-2) 48%,var(--bg-3) 89%);display:flex;flex-direction:column;font-family:Arial,sans-serif;min-height:100vh;padding:40px}.title{color:#3c2b23;font-size:2rem;font-weight:700;margin-bottom:20px}.account-card{background:var(--card-bg);border-radius:16px;box-shadow:0 4px 12px #0003;flex-direction:row;justify-content:space-between;max-width:700px;padding:30px;width:80%}.account-card,.left-section{align-items:center;display:flex}.left-section{flex:1 1;justify-content:center}.account-avatar{background-color:#f1d0b6;border-radius:50%;height:120px;object-fit:cover;padding:10px;width:120px}.right-section{display:flex;flex:2 1;flex-direction:column;gap:12px}label{color:#3c2b23;font-weight:700;margin-top:5px}input,textarea{background-color:#fff;border:none;border-radius:8px;box-shadow:inset 0 1px 3px #0000001a;font-size:1rem;padding:10px;width:100%}textarea{height:80px;resize:none}.account-buttons{flex-wrap:wrap;gap:20px;margin-top:40px;width:100%}.account-buttons,.btn{align-items:center;display:flex;justify-content:center}.btn{border:none;border-radius:10px;box-shadow:0 3px 6px #00000026;cursor:pointer;font-size:1rem;font-weight:600;gap:8px;height:55px;text-align:center;transition:all .25s ease;width:220px}.btn.back,.btn.edit{background-color:#3c2b23;color:#fff}.btn.back:hover,.btn.edit:hover{background-color:#5a3d31}.btn.info{background-color:#ffd9ba;color:#3c2b23}.btn.info:hover{background-color:#f4b991}.btn.logout{background-color:#c84848;color:#fff}.btn.logout:hover{background-color:#a93636;transform:translateY(-2px)}@media (max-width:650px){.account-buttons{align-items:center;flex-direction:column;gap:14px}.btn{max-width:250px;width:100%}}.groupchats-container{background:linear-gradient(180deg,var(--bg-1) 5%,var(--bg-2) 48%,var(--bg-3) 89%);color:var(--text-main);display:flex;font-family:Poppins,sans-serif;height:100vh;overflow:hidden;width:100vw}.groupchats-sidebar{align-items:center;background:var(--sidebar-bg);color:var(--sidebar-text);display:flex;flex-direction:column;justify-content:flex-start;padding:20px 10px;width:220px}.modal-friend img{border-radius:50%;flex-shrink:0;height:50px;object-fit:cover;width:50px}.groupchats-sidebar h2{font-size:22px;margin-bottom:20px;text-align:center}.groupchats-dm-list{flex:1 1;overflow-y:auto;width:100%}.groupchats-dm{background:#ffffff1a;border-radius:8px;cursor:pointer;margin-bottom:8px;padding:12px;transition:background .2s}.groupchats-dm:hover{background:#fff3}.groupchats-dm.unread{background:var(--sidebar-text);color:var(--text-main);font-weight:700}.groupchats-back-btn{background:var(--header-border);border:none;border-radius:8px;color:var(--header-text);cursor:pointer;font-weight:700;margin-top:10px;padding:10px;width:100%}.group-avatar{border-radius:50%;flex-shrink:0;height:50px;margin-right:10px;object-fit:cover;width:50px}.groupchats-back-btn:hover{background:var(--sidebar-hover)}.groupchats-chat-area{display:flex;flex:1 1;flex-direction:column;padding:15px}.groupchats-chat-header{align-items:center;background:var(--header-bg);border-radius:6px;color:var(--header-text);display:flex;font-size:20px;gap:12px;justify-content:space-between;margin-bottom:10px;padding:10px 20px}.groupchats-chat-header-avatar{border:2px solid var(--avatar-border);border-radius:50%;height:45px;object-fit:cover;width:45px}.groupchats-chat-body{background:var(--friend-card-bg);border-radius:8px;display:flex;flex:1 1;flex-direction:column;justify-content:flex-start;overflow-y:auto;padding:20px}.groupchats-message-row{align-items:flex-start;display:flex;gap:10px;margin-bottom:15px;max-width:75%}.groupchats-message-row.received{align-self:flex-start;flex-direction:row}.groupchats-message-row.sent{align-self:flex-end;flex-direction:row-reverse}.groupchats-msg-avatar{border-radius:50%;height:40px;object-fit:cover;width:40px}.groupchats-message-bubble{background:var(--msg-received-bg);border-radius:18px;display:flex;flex-direction:column;padding:10px 15px;position:relative}.groupchats-message-row.sent .groupchats-message-bubble{background:var(--msg-sent-bg);color:var(--msg-sent-text)}.groupchats-msg-name{color:var(--msg-name-text);font-size:14px;font-weight:700;margin-bottom:3px}.groupchats-message-row.sent .groupchats-msg-name{color:var(--msg-name-sent-text)}.groupchats-message-text{word-wrap:break-word;font-size:15px;line-height:1.4}.groupchats-input-box{border-top:3px solid var(--header-border);padding:15px 20px}.groupchats-chat-input,.groupchats-input-box{align-items:center;background:var(--header-bg);display:flex}.groupchats-chat-input{gap:12px;width:100%}.groupchats-chat-input input{background:var(--input-bg);border:none;border-radius:25px;border-top:2px solid var(--input-border-top);color:var(--input-text);flex:1 1;font-size:17px;height:50px;outline:none;padding:0 18px}.groupchats-icon-group{display:flex;gap:10px}.groupchats-icon-btn img{height:28px;width:28px}.groupchats-send-btn img{background:var(--accent-1);border-radius:50%;padding:10px;transition:background .3s}.groupchats-send-btn img:hover{background:var(--accent-2)}.modal-overlay{align-items:center;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#00000073;display:flex;inset:0;justify-content:center;position:fixed;z-index:1000}.modal-box{background:#fff8f3;border:1px solid #d8bca7;border-radius:16px;box-shadow:0 10px 30px #00000059;color:#3c2b23;max-height:80vh;overflow-y:auto;padding:25px 30px;width:460px}.modal-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:10px}.modal-input{border:none;border-radius:8px;margin-bottom:10px;padding:10px 12px;width:100%}.modal-friends{grid-gap:8px;display:grid;gap:8px;grid-template-columns:1fr 1fr;margin-top:8px}.modal-friend{align-items:center;background:#ffe9dc;border:1px solid #f3c7a8;border-radius:10px;cursor:pointer;display:flex;gap:10px;padding:8px;transition:transform .08s ease,background .2s ease}.modal-friend:hover{background:#ffe0cf;transform:translateY(-1px)}.modal-friend.selected{background:#c84848;border-color:#c84848;color:#fff}.modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:14px}.cancel-btn{background:#fff;border:1px solid #d8bca7;border-radius:10px;color:#3c2b23}.cancel-btn,.confirm-btn{cursor:pointer;padding:8px 14px}.confirm-btn{background:#c84848;border:none;border-radius:10px;color:#fff}.confirm-btn:hover{background:#a93636}.msg-time{align-items:center;color:var(--text-main);display:flex;font-size:12px;gap:4px;justify-content:flex-end;margin-top:5px;opacity:.9}.message-row.sent .msg-time{color:var(--header-text)}.check{font-size:.85rem;margin-left:3px;-webkit-user-select:none;user-select:none}.check.gray{color:var(--check-gray)}.check.blue{color:var(--check-blue)}@keyframes fadeInCheck{0%{opacity:0;transform:translateY(-2px)}to{opacity:1;transform:translateY(0)}}.check{animation:fadeInCheck .3s ease-in}.create-group{background-color:var(--group-button)}@keyframes fadeInModal{0%{opacity:0}to{opacity:1}}@keyframes popIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.settings-bg-gradient{align-items:center;background:linear-gradient(to bottom,var(--bg-1),var(--bg-2),var(--bg-3));display:flex;justify-content:center;min-height:100vh;overflow:hidden;width:100vw}.settings-container{background:var(--card-bg);border-radius:16px;box-shadow:0 2px 16px #00000014;color:var(--text-main);margin:40px auto;max-width:700px;padding:32px 24px}.settings-container h1{background:linear-gradient(90deg,var(--bg-1),var(--bg-2));border-bottom:2px solid var(--header-border);border-radius:8px 8px 0 0;color:var(--header-text);margin-bottom:32px;padding:16px 0 8px;text-align:center}.settings-section{background:var(--card-bg);border-radius:8px;box-shadow:0 1px 6px #0000000a;margin-bottom:24px;padding:20px 16px}.settings-section h2{color:var(--header-bg);margin-bottom:8px;text-align:center}.settings-section p{color:var(--text-main);margin-bottom:12px}.settings-section input,.settings-section select{background:var(--input-bg);border:1px solid var(--input-border-top);border-radius:4px;color:var(--input-text);font-size:1rem;margin-bottom:12px;padding:8px;width:100%}.settings-section button{background:var(--accent-1);border:none;border-radius:4px;color:var(--header-bg);cursor:pointer;font-size:1rem;margin-top:8px;padding:8px 16px}.settings-section button:hover{background:var(--accent-2)}.back-btn{align-items:center;background:var(--accent-1);border:none;border-radius:8px;color:var(--header-bg);cursor:pointer;display:flex;font-weight:600;justify-content:center;margin:0 auto 24px;max-width:600px;padding:18px 80px;white-space:nowrap}.back-btn,.back-btn span{font-size:1.35rem;text-align:center;width:100%}.theme-toggle-row{align-items:center;display:flex;gap:16px;justify-content:center;padding:12px 0}.theme-toggle-row span{color:var(--text-main);font-size:1rem}.switch{display:inline-block;height:34px;position:relative;width:60px}.switch input{height:0;opacity:0;width:0}.slider{background-color:var(--input-border-top);border-radius:34px;bottom:0;cursor:pointer;left:0;right:0;top:0}.slider,.slider:before{position:absolute;transition:.4s}.slider:before{background-color:var(--card-bg);border-radius:50%;bottom:4px;content:"";height:26px;left:4px;width:26px}input:checked+.slider{background-color:var(--accent-1)}input:checked+.slider:before{transform:translateX(26px)}.slider.round{border-radius:34px}.slider.round:before{border-radius:50%}.personalization-container{align-items:center;background:linear-gradient(180deg,var(--bg-1) 5%,var(--bg-2) 48%,var(--bg-3) 89%);display:flex;flex-direction:column;font-family:Arial,sans-serif;height:100vh;overflow:auto;padding:1.5vw 3vw}.personalization-title{color:var(--text-main);font-size:clamp(1.1rem,1.4vw,1.6rem);margin-bottom:1rem}.top-preview-card{background-color:var(--card-bg);border-radius:16px;box-shadow:0 4px 10px #0003;margin-bottom:40px;padding:25px;text-align:center;transition:background-color .3s ease;width:300px}.top-avatar{border:3px solid #fff;border-radius:50%;height:90px;margin-bottom:12px;object-fit:cover;width:90px}.top-preview-card p,.top-preview-card span{color:var(--text-main);font-size:clamp(.85rem,1vw,1rem)}.personalization-card{background:var(--card-bg);border-radius:10px;box-shadow:0 2px 6px #00000026;font-size:.85rem;margin-bottom:20px;padding:10px 14px;width:350px}.personalization-card *{transform:scale(.9);transform-origin:top center}.avatar-options{display:flex;flex-wrap:wrap;gap:clamp(4px,.6vw,8px);justify-content:center;margin:10px 0}.avatar-choice{border:2px solid #0000;border-radius:50%;cursor:pointer;height:clamp(40px,5vw,55px);object-fit:cover;transition:transform .2s ease,border-color .2s ease;width:clamp(40px,5vw,55px)}.avatar-choice:hover{border-color:var(--accent-2);transform:scale(1.06)}.selected-avatar{border-color:var(--text-main);transform:scale(1.1)}input[type=text],textarea{border-radius:8px;color:#000;font-family:inherit;font-size:.9rem;padding:6px 8px;resize:none}input[type=color],input[type=text],textarea{background:#fff;border:1px solid #ccc;width:100%}input[type=color]{appearance:none;-webkit-appearance:none;border-radius:8px;box-shadow:inset 0 1px 3px #0000001a;cursor:pointer;height:45px;padding:4px}input[type=color]::-moz-color-swatch,input[type=color]::-webkit-color-swatch{border:none;border-radius:6px}.section h2{color:var(--text-main);font-weight:600;margin-bottom:8px}.back-btn,.change-btn,.save-btn{background:var(--btn-primary-bg);border:none;border-radius:8px;color:var(--btn-primary-text);cursor:pointer;font-size:.95rem;margin-top:10px;padding:10px 20px;transition:background .2s ease,transform .2s ease}.back-btn:hover,.change-btn:hover,.save-btn:hover{background:var(--btn-primary-hover);transform:translateY(-2px)}.save-btn{background:var(--accent-1);color:var(--header-bg)}.save-btn:hover{background:var(--accent-2)}.logout-btn{background:#c84848;border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:.95rem;margin-top:10px;padding:10px 20px;transition:background .2s ease,transform .2s ease}.logout-btn:hover{background:#a93636;transform:translateY(-2px)}.personalization-buttons{align-items:center;display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:20px}@media (max-width:600px){.personalization-buttons{flex-direction:column;gap:12px}.back-btn,.change-btn,.logout-btn,.save-btn{max-width:240px;width:100%}}.hidden{display:none}
/*# sourceMappingURL=main.d1f9bbad.css.map*/