.groups-page{flex:1;height:100%;display:flex;overflow:hidden}.groups-window{background:var(--surface);border:1px solid var(--border);border-radius:14px;flex:1;min-width:0;height:calc(100vh - 32px);margin:1rem;display:flex;overflow:hidden}.groups-page.chat-integrated{height:100%;margin:0}.groups-page.chat-integrated .groups-window{height:calc(100vh - 32px);margin:1rem}@media (max-width:680px){.groups-page.chat-integrated .groups-window{border:none;border-radius:0;height:100%;margin:0}}.groups-left-panel{border-right:1px solid var(--border);background:#0d0b1a80;flex-direction:column;flex-shrink:0;width:280px;display:flex;overflow:hidden}.groups-left-header{border-bottom:1px solid var(--border);flex-shrink:0;padding:1.25rem 1rem .75rem}.groups-left-title{color:var(--text);margin-bottom:.85rem;font-family:Fraunces,serif;font-size:1.15rem;font-style:italic;font-weight:700}.groups-create-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;gap:.4rem;width:100%;padding:.55rem 1rem;font-family:Syne,sans-serif;font-size:.82rem;font-weight:700;transition:background .2s,transform .15s;display:flex}.groups-create-btn:hover{background:#7c3aed;transform:scale(1.02)}.groups-list{flex:1;padding:.5rem;overflow-y:auto}.groups-list-item{cursor:pointer;text-align:left;width:100%;color:var(--text);background:0 0;border:1px solid #0000;border-radius:10px;align-items:center;gap:.75rem;padding:.75rem;font-family:Syne,sans-serif;transition:background .2s,border-color .2s;display:flex}.groups-list-item:hover{background:#8b5cf60f}.groups-list-item.active{background:var(--accent-dim);border-color:var(--accent)}.groups-list-icon{background:var(--surface-hi);border:1px solid var(--border);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;font-size:1.1rem;display:flex}.groups-list-info{flex:1;min-width:0}.groups-list-name{color:var(--text);white-space:nowrap;text-overflow:ellipsis;font-size:.85rem;font-weight:700;overflow:hidden}.groups-list-meta{color:var(--text-muted);margin-top:.1rem;font-size:.72rem}.groups-list-badge{border-radius:20px;flex-shrink:0;padding:.15rem .5rem;font-size:.65rem;font-weight:700}.groups-list-right{flex-shrink:0;align-items:center;gap:.35rem;display:flex}.groups-unread-badge{background:var(--accent);color:#fff;border-radius:999px;justify-content:center;align-items:center;min-width:18px;height:18px;padding:0 5px;font-family:Syne,sans-serif;font-size:.6rem;font-weight:700;line-height:1;animation:.2s both badge-pop;display:flex}@keyframes badge-pop{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.groups-list-item.has-unread .groups-list-name{color:var(--text);font-weight:800}.groups-tab-unread-dot{color:#fff;border:1.5px solid var(--surface);background:#ef4444;border-radius:999px;justify-content:center;align-items:center;min-width:14px;height:14px;padding:0 3px;font-family:Syne,sans-serif;font-size:.55rem;font-weight:700;line-height:1;display:flex;position:absolute;top:2px;right:2px}.groups-list-badge.member{color:var(--accent);background:#8b5cf626}.groups-list-badge.pending{color:#d4a843;background:#eab3081f}.groups-list-empty{text-align:center;color:var(--text-subtle);padding:2.5rem 1rem;font-size:.82rem;line-height:1.6}.groups-center-panel{flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}.groups-welcome{text-align:center;color:var(--text-muted);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.85rem;padding:2rem;display:flex}.groups-welcome-icon{background:var(--accent-dim);border:1px solid #8b5cf633;border-radius:50%;justify-content:center;align-items:center;width:68px;height:68px;font-size:1.8rem;display:flex}.groups-welcome-title{color:var(--text);font-family:Fraunces,serif;font-size:1.35rem;font-style:italic;font-weight:700}.groups-welcome-text{max-width:260px;font-size:.85rem;line-height:1.6}.groups-center-header{border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0d0b1acc;flex-shrink:0;align-items:center;gap:.75rem;padding:.85rem 1.25rem;display:flex}.groups-center-icon{background:var(--accent-dim);border:1px solid #8b5cf633;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-size:1rem;display:flex}.groups-center-info{flex:1;min-width:0}.groups-center-name{color:var(--text);font-size:.95rem;font-weight:700}.groups-center-desc{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;font-size:.72rem;overflow:hidden}.groups-center-actions{flex-shrink:0;gap:.5rem;display:flex}.groups-action-btn{cursor:pointer;border:1px solid #0000;border-radius:7px;padding:.4rem .85rem;font-family:Syne,sans-serif;font-size:.78rem;font-weight:700;transition:all .18s}.groups-action-btn.primary{background:var(--accent);color:#fff;border-color:var(--accent)}.groups-action-btn.primary:hover{background:#7c3aed}.groups-action-btn.danger{color:#f87171;background:#ef44441f;border-color:#ef444433}.groups-action-btn.danger:hover{background:#ef444433}.groups-action-btn.muted{background:var(--surface-hi);color:var(--text-muted);border-color:var(--border)}.groups-action-btn.muted:hover{color:var(--text);border-color:var(--accent)}.groups-action-btn:disabled{opacity:.45;cursor:not-allowed}.groups-center-body{flex-direction:column;flex:1;gap:1rem;min-height:0;padding:1.25rem;display:flex;overflow-y:auto}.groups-error-banner{color:#f87171;background:#ef44441a;border:1px solid #ef444440;border-radius:8px;padding:.6rem 1rem;font-size:.82rem}.groups-info-card{background:var(--surface-hi);border:1px solid var(--border);border-radius:12px;padding:1.25rem}.groups-info-title{color:var(--text);margin-bottom:.35rem;font-family:Fraunces,serif;font-size:1.4rem;font-style:italic;font-weight:700}.groups-info-desc{color:var(--text-muted);margin-bottom:1rem;font-size:.85rem;line-height:1.6}.groups-info-stats{color:var(--text-subtle);gap:1.5rem;font-size:.78rem;display:flex}.groups-info-stat span{color:var(--text);margin-right:.25rem;font-weight:700}.groups-not-member{text-align:center;color:var(--text-muted);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.75rem;padding:3rem;display:flex}.groups-not-member-icon{opacity:.4;font-size:2.5rem}.groups-not-member-title{color:var(--text);font-size:1rem;font-weight:700}.groups-not-member-sub{max-width:240px;font-size:.85rem;line-height:1.6}.groups-center-loading{flex:1;justify-content:center;align-items:center;display:flex}.groups-spinner{border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:18px;height:18px;animation:.6s linear infinite gs-spin}@keyframes gs-spin{to{transform:rotate(360deg)}}.groups-right-panel{border-left:1px solid var(--border);background:#0d0b1a59;flex-direction:column;flex-shrink:0;width:240px;padding:1rem 0;display:flex;overflow:hidden}.groups-right-title{text-transform:uppercase;letter-spacing:.1em;color:var(--text-subtle);border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;margin-bottom:.5rem;padding:.5rem 1rem .75rem;font-size:.68rem;font-weight:700;display:flex}.groups-invite-trigger{background:var(--accent);color:#fff;cursor:pointer;text-transform:none;letter-spacing:normal;border:none;border-radius:4px;padding:.15rem .4rem;font-size:.6rem;font-weight:800;transition:opacity .2s,transform .1s}.groups-invite-trigger:hover{opacity:.9;transform:translateY(-1px)}.groups-right-list{flex:1;padding:0 .5rem;overflow-y:auto}.groups-member-item{color:var(--text);border-radius:8px;align-items:center;gap:.6rem;padding:.45rem .6rem;font-family:Syne,sans-serif;transition:background .18s;display:flex}.groups-member-item:hover{background:#8b5cf60f}.groups-member-avatar{background:var(--surface-hi);border:1px solid var(--border);width:30px;height:30px;color:var(--accent);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:.65rem;font-weight:700;display:flex;overflow:hidden}.groups-member-avatar img{-o-object-fit:cover;object-fit:cover;border-radius:50%;width:100%;height:100%}.groups-member-info{flex:1;min-width:0}.groups-member-name{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;font-size:.78rem;font-weight:600;overflow:hidden}.groups-member-role{color:var(--text-subtle);margin-top:.05rem;font-size:.62rem}.groups-right-empty{text-align:center;color:var(--text-subtle);padding:1.5rem 1rem;font-size:.8rem;line-height:1.6}.groups-modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:200;background:#0009;justify-content:center;align-items:center;animation:.15s gmo-fade;display:flex;position:fixed;inset:0}@keyframes gmo-fade{0%{opacity:0}to{opacity:1}}.groups-modal-window{background:var(--surface);border:1px solid var(--border);border-radius:16px;width:100%;max-width:440px;animation:.18s gmo-slide;box-shadow:0 24px 64px #0009}@keyframes gmo-slide{0%{opacity:0;transform:translateY(-12px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.groups-modal-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:1.25rem 1.5rem .75rem;display:flex}.groups-modal-header h2{color:var(--text);font-family:Fraunces,serif;font-size:1.15rem;font-style:italic;font-weight:700}.groups-modal-close{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:.2rem .5rem;font-size:1.4rem;line-height:1;transition:color .18s,background .18s}.groups-modal-close:hover{color:var(--text);background:#8b5cf614}.groups-modal-body{flex-direction:column;gap:1rem;padding:1.25rem 1.5rem;display:flex}.groups-field-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;flex-direction:column;gap:.4rem;font-family:Syne,sans-serif;font-size:.8rem;font-weight:700;display:flex}.groups-field-input,.groups-field-textarea{background:var(--surface-hi);border:1px solid var(--border);color:var(--text);border-radius:8px;outline:none;width:100%;padding:.6rem .85rem;font-family:Syne,sans-serif;font-size:.9rem;transition:border-color .2s,box-shadow .2s}.groups-field-input:focus,.groups-field-textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim)}.groups-field-textarea{resize:vertical;min-height:90px}.groups-date-input::-webkit-datetime-edit-fields-wrapper{display:none}.groups-date-input::-webkit-datetime-edit{display:none}.groups-date-input::-webkit-datetime-edit-text{display:none}.groups-date-input::-webkit-datetime-edit-month-field{display:none}.groups-date-input::-webkit-datetime-edit-day-field{display:none}.groups-date-input::-webkit-datetime-edit-year-field{display:none}.groups-date-input::-webkit-datetime-edit-hour-field{display:none}.groups-date-input::-webkit-datetime-edit-minute-field{display:none}.groups-date-input::-webkit-datetime-edit-ampm-field{display:none}.groups-date-input::-webkit-calendar-picker-indicator{filter:invert()brightness(1.6);cursor:pointer;opacity:.85;width:1.4rem;height:1.4rem;margin-left:auto}.groups-date-input::-webkit-calendar-picker-indicator:hover{opacity:1}.groups-date-input{cursor:pointer;justify-content:flex-end;align-items:center;min-height:2.4rem;display:flex}.groups-modal-footer{border-top:1px solid var(--border);justify-content:flex-end;gap:.6rem;padding:.75rem 1.5rem 1.25rem;display:flex}.groups-mobile-back{display:none}@media (max-width:680px){.groups-mobile-back{color:var(--text-muted);cursor:pointer;background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;margin-right:.25rem;padding:.25rem;display:flex}}@media (max-width:1100px){.groups-right-panel{display:none}}@media (max-width:860px){.groups-left-panel{width:220px}}@media (max-width:680px){.groups-page{height:calc(100vh - 68px)}.groups-window{border-radius:10px;height:calc(100vh - 84px);margin:.5rem}.groups-left-panel{border-right:none;width:100%}.groups-left-panel.mobile-hidden,.groups-center-panel.mobile-hidden{display:none}.groups-center-panel{width:100%}}.events-strip{-webkit-overflow-scrolling:touch;background:0 0;border-bottom:1px solid #ffffff08;gap:12px;padding:12px;display:flex;overflow-x:auto}.events-strip .event-pill{color:#ddd;white-space:nowrap;background:#ffffff05;border:1px solid #ffffff08;border-radius:10px;min-width:180px;max-width:320px;padding:10px 14px}.events-strip .event-pill.empty{opacity:.6}.events-strip::-webkit-scrollbar{height:8px}.events-strip::-webkit-scrollbar-thumb{background:#ffffff0f;border-radius:6px}.groups-center-tabs{gap:8px;padding:10px 12px;display:flex}.tab-btn{color:#dcd;cursor:pointer;background:0 0;border:1px solid #ffffff08;border-radius:8px;padding:6px 10px}.tab-btn.active{background:#ffffff08}.groups-chat-panel .chat-messages{flex-direction:column;gap:8px;max-height:360px;padding:12px;display:flex;overflow-y:auto}.groups-chat-panel .chat-message{background:#ffffff03;border-radius:8px;padding:8px 10px}.groups-chat-panel .chat-message-author{color:#e7e7e7;font-size:.9rem;font-weight:600}.groups-chat-panel .chat-message-text{color:#ddd;margin-top:6px}.groups-chat-panel .chat-message-time{color:#aaa;margin-top:6px;font-size:.75rem}.groups-chat-panel .chat-input-row{border-top:1px solid #ffffff05;gap:8px;padding:10px;display:flex}.groups-chat-panel .chat-input{color:#fff;background:#ffffff05;border:1px solid #ffffff05;border-radius:8px;flex:1;padding:8px 10px}.groups-chat-panel .chat-send-btn{color:#fff;cursor:pointer;background:linear-gradient(90deg,#8f5cff,#b37bff);border:none;border-radius:8px;padding:8px 12px}.groups-chat-panel{flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden}.groups-chat-log{flex-direction:column;flex:1;gap:.5rem;padding:1rem 1.25rem;display:flex;overflow-y:auto}.group-detail-chat-row{align-items:flex-end;gap:.5rem;margin-bottom:.25rem;display:flex}.group-detail-chat-row.mine{flex-direction:row-reverse}.group-detail-chat-row.other{flex-direction:row}.group-detail-chat-avatar{background:var(--accent-dim);border:1px solid var(--accent);width:28px;height:28px;color:var(--accent);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:.65rem;font-weight:700;display:flex;overflow:hidden}.group-detail-chat-avatar img{-o-object-fit:cover;object-fit:cover;border-radius:50%;width:100%;height:100%}.group-detail-chat-bubble{word-break:break-word;border-radius:18px;max-width:68%;padding:.55rem .9rem}.group-detail-chat-bubble.mine{background:var(--accent);color:#fff;border-radius:18px 18px 4px}.group-detail-chat-bubble.other{background:var(--surface-hi);border:1px solid var(--border);color:var(--text);border-radius:18px 18px 18px 4px}.group-detail-chat-sender{opacity:.75;margin-bottom:.2rem;font-size:.7rem;font-weight:700}.group-detail-chat-bubble.mine .group-detail-chat-sender{color:#fffc}.group-detail-chat-bubble.other .group-detail-chat-sender{color:var(--accent)}.group-detail-chat-content{font-size:.88rem;line-height:1.45}.group-detail-chat-time{text-align:right;margin-top:.2rem;font-size:.65rem}.group-detail-chat-time.mine{color:#ffffff8c}.group-detail-chat-time.other{color:var(--text-subtle)}.groups-chat-composer{border-top:1px solid var(--border);background:#0d0b1acc;flex-shrink:0;gap:.5rem;padding:.75rem 1.25rem;display:flex}.groups-chat-input{border:1px solid var(--border);background:var(--surface-hi);color:var(--text);border-radius:24px;outline:none;flex:1;padding:.6rem 1rem;font-family:Syne,sans-serif;font-size:.9rem;transition:border-color .2s}.groups-chat-input:focus{border-color:var(--accent)}.groups-action-btn.disabled-btn{opacity:.45;cursor:not-allowed}.groups-emoji-wrapper{align-items:center;display:flex;position:relative}.groups-emoji-trigger{cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:.35rem;font-size:1.25rem;transition:background .2s,transform .1s;display:flex}.groups-emoji-trigger:hover{background:#8b5cf626;transform:scale(1.1)}.groups-emoji-picker-popover{z-index:1000;border-radius:12px;animation:.2s ease-out picker-fade-in;position:absolute;bottom:calc(100% + 10px);left:0;overflow:hidden;box-shadow:0 10px 30px #0006}@keyframes picker-fade-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.groups-emoji-picker-popover .epr-body::-webkit-scrollbar{width:6px}.groups-emoji-picker-popover .epr-body::-webkit-scrollbar-thumb{background:var(--accent);border-radius:10px}.group-detail-event-card{background:var(--surface-hi);border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:1rem;padding:1.25rem;display:flex}.group-detail-event-header{justify-content:space-between;align-items:flex-start;display:flex}.group-detail-event-title{margin:0 0 .25rem;font-size:1rem}.group-detail-event-desc{color:var(--text-muted);margin:0 0 .35rem;font-size:.85rem}.group-detail-event-meta{color:var(--text-subtle);font-size:.78rem}.group-detail-delete-event-btn{color:#f87171;cursor:pointer;background:#ef44441f;border:1px solid #ef444433;border-radius:6px;padding:.3rem .7rem;font-family:Syne,sans-serif;font-size:.78rem;transition:background .18s}.group-detail-delete-event-btn:hover{background:#ef444440}.group-detail-going-count{color:#4ade80;font-size:.85rem;font-weight:600}.group-detail-notgoing-count{color:#f87171;font-size:.85rem;font-weight:600}.group-detail-response-going,.group-detail-response-notgoing,.group-detail-response-expired{border-radius:8px;flex-wrap:wrap;align-items:center;gap:.5rem;padding:.5rem .85rem;font-size:.85rem;display:flex}.group-detail-response-going{background:#22c55e1f}.group-detail-response-notgoing{background:#ef44441f}.group-detail-response-expired{color:var(--text-subtle);background:#6464641f}.group-detail-response-going span{color:#4ade80}.group-detail-response-notgoing span{color:#f87171}.groups-center-panel{overflow:hidden}
