:root{--background: #1b1d22;--foreground: #e4e4e4;--card: #2e3437;--card-foreground: #e4e4e4;--popover: #2e3437;--popover-foreground: #e4e4e4;--primary: #6d5de7;--primary-foreground: #ffffff;--secondary: #4b0083;--secondary-foreground: #e4e4e4;--muted: #454545;--muted-foreground: #a4a4a4;--accent: #6394eb;--accent-foreground: #e4e4e4;--destructive: #f14444;--border: #454545;--input: #454545;--ring: #6d5de7;--chart-1: #6d5de7;--chart-2: #8f45ae;--chart-3: #4b0083;--chart-4: #6394eb;--chart-5: #4683b5;--sidebar: #1b1d22;--sidebar-foreground: #e4e4e4;--sidebar-primary: #6d5de7;--sidebar-primary-foreground: #ffffff;--sidebar-accent: #6394eb;--sidebar-accent-foreground: #e4e4e4;--sidebar-border: #454545;--sidebar-ring: #6d5de7;--shadow-2xs: 0 1px 3px 0px rgb(0 0 0 / .05);--shadow-xs: 0 1px 3px 0px rgb(0 0 0 / .05);--shadow-sm: 0 1px 3px 0px rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--shadow: 0 1px 3px 0px rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--shadow-md: 0 1px 3px 0px rgb(0 0 0 / .1), 0 2px 4px -1px rgb(0 0 0 / .1);--shadow-lg: 0 1px 3px 0px rgb(0 0 0 / .1), 0 4px 6px -1px rgb(0 0 0 / .1);--shadow-xl: 0 1px 3px 0px rgb(0 0 0 / .1), 0 8px 10px -1px rgb(0 0 0 / .1);--shadow-2xl: 0 1px 3px 0px rgb(0 0 0 / .25)}*{margin:0;padding:0;box-sizing:border-box;font-family:Montserrat,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}#root{background-color:var(--background);color:var(--foreground);min-height:100vh}h1,h2,h3,h4,h5,h6{font-family:Merriweather,serif}.auth-container{max-width:1000px;padding:4rem 0;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:20px}.auth-hero{text-align:center}.auth-hero h1{font-size:32px;margin-bottom:8px}.auth-hero p{color:var(--muted-foreground);margin:0}.auth-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:20px;box-shadow:0 10px 30px #0000000d;width:40%}.auth-tabs{display:flex;gap:10px;margin-bottom:16px}.auth-tabs button{flex:1;border:none;padding:10px 12px;border-radius:8px;font-weight:600;cursor:pointer;transition:all .15s ease}.auth-tabs button.active{background:var(--background);color:var(--primary-foreground)}.auth-body{margin-top:8px}.form h3{margin-bottom:.5rem}.form p:not(:last-child){margin-bottom:1.5rem;color:var(--muted-foreground)}.form label{display:block;font-weight:600;color:var(--card-foreground);margin-bottom:.3rem}.input-box{margin-bottom:1rem;margin-top:.3rem;position:relative}.form input{width:100%;padding:.5rem;border:1px solid var(--input);border-radius:7px;background-color:color-mix(in oklab,var(--input)30%,transparent);color:var(--foreground);outline:none}.form input:focus{outline:2px solid color-mix(in oklab,var(--ring)50%,transparent)}.btn{padding:.75rem;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:background .15s ease}.primary{background:var(--primary);color:var(--primary-foreground)}.primary:hover{background:color-mix(in oklab,var(--primary)80%,transparent)}.secondary{background:var(--secondary);color:var(--secondary-foreground)}.secondary:hover{background:color-mix(in oklab,var(--secondary)80%,transparent)}.error-messages{color:var(--destructive);font-weight:600;font-size:.875rem;margin-top:1rem}.loader{width:48px;height:48px;border:5px solid #FFF;border-bottom-color:transparent;border-radius:50%;display:inline-block;box-sizing:border-box;animation:rotation 1s linear infinite;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.wake-banner{position:fixed;top:0;left:0;right:0;z-index:9999;display:flex;gap:12px;align-items:center;justify-content:space-between;padding:10px 14px;background:#1e293beb;color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,.12)}.wake-banner-inner{font-size:14px;line-height:1.2}.wake-banner-dismiss{border:1px solid rgba(255,255,255,.2);background:transparent;color:#fff;width:32px;height:32px;border-radius:8px;cursor:pointer;display:grid;place-items:center}.wake-banner-dismiss:hover{background:#ffffff14}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.home-container{display:flex;height:100vh}.left-panel{position:relative;flex:0 0 25%;display:flex;flex-direction:column;border-right:1px solid var(--border)}.chat-window{flex:1 1 75%;display:flex;position:relative}.profile-section{padding:1rem;border-top:1px solid var(--border);background-color:var(--background);text-align:center;display:flex;align-items:center;gap:10px;margin-top:auto}.profile-section img{width:40px;height:40px;border-radius:50%}.profile-section .profile-info{text-align:left;margin-right:auto}.profile-section .profile-info h2{margin:0;font-size:1.25rem}.profile-section .profile-info p{margin:0;color:var(--muted-foreground);font-size:.875rem}.profile-section .actions{display:flex;gap:10px}.profile-section .actions svg{cursor:pointer;color:var(--muted-foreground);transition:color .15s ease}.profile-section .actions svg:hover{color:var(--foreground)}.modal-backdrop{position:fixed;inset:0;background:#00000080;display:grid;place-items:center;z-index:1000}.modal-card{width:min(420px,90vw);background:var(--background);border:1px solid var(--border);border-radius:.8rem;padding:1.3rem}.secondary-btn{padding:.75rem;border-radius:.8rem;border:1px solid var(--border);background-color:color-mix(in oklab,var(--input)30%,transparent);color:var(--foreground);cursor:pointer;font-size:.9rem}.secondary-btn:hover{background:color-mix(in oklab,var(--border)20%,transparent)}.avatar-preview{display:flex;align-items:space-between;gap:.75rem;margin:.75rem 0}.avatar-preview img{width:4rem;height:4rem;border-radius:50%;object-fit:cover;border:1px solid var(--border)}.avatar-actions{display:flex;gap:8px}.upload-btn{display:inline-flex;align-items:center;justify-content:center}.form-actions{display:flex;gap:10px}.form-actions *{flex:1}.tabs{display:flex;gap:10px;padding:1rem;justify-content:center;border-bottom:1px solid var(--border)}.tabs button{flex:1;border:none;padding:10px 12px;border-radius:8px;font-weight:600;cursor:pointer;transition:all .15s ease;background:var(--background);color:var(--primary-foreground);border:1px solid var(--input)}.tabs button:hover{background:color-mix(in oklab,var(--input)30%,transparent)}.tabs button.active{background:var(--primary)}.friends-panel,.chats-panel{padding:1rem 1.5rem;min-height:0}.friends-top{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:1rem}.panel-title{text-align:center;font-size:1.6rem;margin:.5rem 0 1rem}.segmented{display:flex;background:var(--card);border-radius:99px;padding:6px;gap:6px;border:1px solid var(--border)}.segmented button{background:transparent;border:none;padding:8px 14px;border-radius:999px;color:var(--muted-foreground);cursor:pointer;font-weight:700;position:relative}.segmented button.active{background:var(--primary);color:var(--primary-foreground)}.badge-dot{width:10px;height:10px;border-radius:50%;background:var(--destructive);display:inline-block;margin-left:6px;box-shadow:0 0 0 2px var(--card)}.friend-controls{display:flex;gap:8px;align-items:center}.friend-search{padding:8px 10px;flex:1;border-radius:8px;border:1px solid var(--input);background:var(--card);color:var(--foreground);outline:none}.friend-search:focus{outline:2px solid color-mix(in oklab,var(--ring)50%,transparent)}.friend-list{display:grid;grid-template-columns:1fr;gap:10px;margin-top:1rem}.friend-card{display:flex;align-items:center;gap:12px;padding:10px;border-radius:8px;background:color-mix(in oklab,var(--card) 96%,transparent);border:1px solid var(--border)}.friend-card img,.messages-header img,.group-actions img{width:44px;height:44px;border-radius:50%;object-fit:cover}.friend-meta{flex:1}.friend-name{font-weight:700}.friend-handle{color:var(--muted-foreground);font-size:.9rem}.friend-actions{display:flex;gap:8px}.empty-state{padding:40px 1rem;text-align:center;color:var(--muted-foreground)}.suggestion-img{width:40px;height:40px;border-radius:50%;object-fit:cover;margin-right:12px}.suggestions{list-style:none;max-height:200px;overflow-y:auto;margin-bottom:1rem}.suggestions li{cursor:pointer;display:flex;align-items:center;padding:10px;background-color:var(--background);border-radius:8px}.suggestions li:hover{background-color:color-mix(in oklab,var(--input)40%,transparent)}.suggestions li input[type=checkbox]{margin-left:auto;width:18px;height:18px;cursor:pointer;outline:none}input[type=checkbox]{accent-color:var(--primary)}.clear-search{position:absolute;right:8px;top:50%;transform:translateY(-50%);cursor:pointer;color:var(--muted-foreground);transition:color .15s ease;display:none}.clear-search:hover{color:var(--foreground)}.clear-search.active{display:block}button:disabled,button[disabled]{opacity:.6;cursor:not-allowed}.remove-btn{background-color:color-mix(in oklab,var(--destructive)60%,transparent)}.remove-btn:hover{background:color-mix(in oklab,var(--destructive)70%,transparent)}.empty-chat{flex:1;display:grid;place-items:center;height:100%;padding:2rem;text-align:center}.chat-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}.chat-list-item{display:flex;gap:10px;padding:8px;border-radius:8px;cursor:pointer;align-items:center;border:1px solid var(--border)}.chat-list-item.active{border-color:var(--primary);background:color-mix(in oklab,var(--primary) 12%,transparent)}.chat-avatar img{width:40px;height:40px;border-radius:50%;object-fit:cover}.group-badge{position:relative;width:48px;height:40px}.group-badge img{position:absolute;width:32px;height:32px;border-radius:50%;object-fit:cover;border:2px solid var(--background)}.group-badge img:first-child{left:0;z-index:2}.group-badge img:last-child{right:0;top:8px;z-index:1}.group-badge.big{width:96px;height:80px}.group-badge.big img{width:64px;height:64px}.chat-meta{display:flex;flex-direction:column}.chat-title{font-weight:700}.chat-subtitle{color:var(--muted-foreground);font-size:.9rem}.tabs,.messages-header{height:5rem}.messages-panel{flex:1 1 75%;display:flex;flex-direction:column;height:100%}.messages-header{display:flex;align-items:center;gap:10px;padding:.75rem 1rem;border-bottom:1px solid var(--border)}.messages-list{flex:1;padding:1rem;overflow-y:auto;scrollbar-color:var(--muted) transparent;scrollbar-width:thin;display:flex;flex-direction:column;gap:8px}.message-input{padding:.75rem 1rem}.input-shell{position:relative;display:flex;align-items:center;background:var(--card);border:1px solid var(--border);border-radius:999px;padding:6px 12px;gap:6px}.input-shell input{flex:1;border:none;background:transparent;color:var(--foreground);outline:none}.icon-btn{border:none;background:transparent;color:var(--muted-foreground);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:4px}.icon-btn:hover{color:var(--foreground)}.send-btn{position:absolute;right:10px;top:50%;transform:translateY(-50%);border:none;background:var(--primary);color:var(--primary-foreground);width:34px;height:34px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.send-btn:hover{filter:brightness(.95)}.message{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:10px;max-width:60%}.chat-header{display:flex;flex-direction:column;align-items:center;gap:12px;margin:2rem auto}.chat-header h4{margin-top:.5rem;color:var(--muted-foreground);font-weight:500}.chat-header img{width:96px;height:96px;border-radius:50%}.message-row{display:flex;gap:12px;align-items:center;padding:4px 8px;margin:0 -8px;border-radius:8px;transition:background-color .15s ease}.message-row:hover{background-color:color-mix(in srgb,var(--muted) 30%,transparent)}.message-row.compact{padding-left:60px;margin-top:-14px;position:relative}.message-row.compact .message-actions{position:absolute;right:8px;top:50%;transform:translateY(-50%)}.message-avatar{width:40px;height:40px;border-radius:50%;object-fit:cover}.message-body{flex:1;display:flex;flex-direction:column;gap:4px}.message-meta{display:flex;align-items:baseline;gap:8px}.message-sender{font-weight:600;font-size:.95rem;color:var(--foreground)}.message-time{font-size:.75rem;color:var(--muted-foreground)}.message-text{margin:0;color:var(--foreground);font-size:.95rem;line-height:1.5;word-wrap:break-word;display:flex;align-items:center}.message-row.compact .message-text{margin-top:0}.message-attachment{margin-top:4px;max-width:320px}.message-attachment img{width:100%;height:auto;border-radius:10px;border:1px solid var(--border);object-fit:cover}.edited-label{font-size:.7rem;color:var(--muted-foreground);margin-left:6px}.message-actions{position:relative;opacity:0;transition:opacity .15s ease}.message-row:hover .message-actions{opacity:1}.attachment-chip{display:inline-flex;align-items:center;gap:8px;background:color-mix(in oklab,var(--muted) 50%,transparent);border:1px solid var(--border);border-radius:999px;padding:6px 10px;margin-bottom:8px;width:fit-content}.attachment-chip button{background:none;border:none;color:var(--muted-foreground);cursor:pointer;font-size:.9rem}.message-actions .icon-btn{padding:4px}.message-actions-menu{position:absolute;right:0;top:100%;margin-top:4px;background:var(--card);border:1px solid var(--border);border-radius:8px;box-shadow:0 4px 12px #00000026;display:flex;flex-direction:column;min-width:120px;z-index:10}.message-actions-menu button{padding:8px 12px;text-align:left;background:none;border:none;color:var(--foreground);cursor:pointer;font-size:.9rem;transition:background-color .1s ease}.message-actions-menu button:hover{background:var(--muted)}.message-actions-menu button.danger{color:var(--destructive)}.message-actions-menu button.danger:hover{background:color-mix(in srgb,var(--destructive) 15%,transparent)}.message-edit{display:flex;flex-direction:column;gap:8px}.message-edit input{padding:8px 12px;border:1px solid var(--border);border-radius:6px;background:var(--background);color:var(--foreground);outline:none;font-size:.95rem}.message-edit-actions{display:flex;gap:8px}.btn-sm{padding:6px 12px;font-size:.85rem;border-radius:6px;border:1px solid var(--border);background:var(--card);color:var(--foreground);cursor:pointer;transition:all .15s ease}.btn-sm:hover{background:var(--muted)}.group-rename{cursor:pointer;color:var(--muted-foreground);transition:color .15s ease}.group-rename:hover{color:var(--foreground)}.group-actions{flex:0 0 22%;padding:1.5rem;border-left:1px solid var(--border);display:flex;flex-direction:column;gap:1.5rem}.group-actions-members,.group-member-meta{display:flex;flex-direction:column}.group-actions-members{gap:10px}.group-member{display:flex;align-items:center;gap:10px;padding:8px;border:1px solid var(--border);border-radius:10px}.group-member button{margin-left:auto}.group-member img{width:36px;height:36px;border-radius:50%;object-fit:cover}.group-member-line{display:inline-flex;align-items:center;gap:6px}.crown{color:gold}.group-actions-title{font-size:1.2rem;font-weight:700;margin-bottom:.75rem;text-align:center}.group-actions-footer{margin-top:auto;display:flex;justify-content:center;gap:1rem}.modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:1rem}.text-btn{background:none;border:none;color:var(--primary);cursor:pointer;font-size:.9rem;padding:4px 8px;border-radius:6px;transition:background-color .15s ease}.text-btn:hover{background:color-mix(in srgb,var(--primary) 15%,transparent)}.add-list{display:flex;flex-direction:column;gap:10px;max-height:200px;overflow-y:auto;margin-bottom:1rem}.add-row{display:flex;align-items:center;gap:12px;padding:8px;border-radius:8px;background:color-mix(in oklab,var(--card) 96%,transparent);border:1px solid var(--border)}
