:root{--bg: #f4f5f7;--surface: #ffffff;--surface-2: #f0f2f5;--text: #1c1e21;--muted: #65676b;--border: #e4e6eb;--primary: #00e676;--primary-2: #00c853;--danger: #ff4444;--shadow-1: 0 1px 2px rgba(16, 24, 40, .06);--shadow-2: 0 6px 18px rgba(16, 24, 40, .12);--radius-sm: 10px;--radius-md: 14px;--radius-lg: 18px;--container: 680px;--container-wide: 920px;--header-h: 64px;--bottom-nav-h: 64px;--ease: cubic-bezier(.2, .9, .2, 1)}html[data-theme=dark]{--bg: #101113;--surface: #16181b;--surface-2: #1f2226;--text: #e7e9ee;--muted: #a9b0bb;--border: #2a2f36;--shadow-1: 0 1px 2px rgba(0, 0, 0, .35);--shadow-2: 0 10px 28px rgba(0, 0, 0, .55)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{height:100%}body{margin:0;font-family:Cairo,system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--text);overflow:hidden;transition:background .2s var(--ease),color .2s var(--ease)}a{color:inherit}button,input,textarea{font:inherit}#app-screen{width:100%;height:100dvh;display:flex;flex-direction:column;overflow:hidden}.sidebar,.chat-panel{display:none}.content-wrapper{flex:1;min-width:0;display:flex;flex-direction:column;overflow:hidden}.app-container{flex:1;min-height:0;display:flex;flex-direction:column}header{height:var(--header-h);display:flex;align-items:center;justify-content:space-between;padding-inline:16px;background:color-mix(in oklab,var(--surface),transparent 6%);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:40;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.logo{display:flex;flex-direction:column;gap:2px;line-height:1.1}.logo-main{font-weight:900;font-size:20px;background:linear-gradient(135deg,var(--primary),var(--primary-2));-webkit-background-clip:text;-webkit-text-fill-color:transparent}.logo-slogan{font-size:11px;color:var(--muted)}.header-icons{display:flex;gap:8px}.icon-btn{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--text);cursor:pointer;transition:transform .14s var(--ease),background .14s var(--ease)}.icon-btn:hover{background:var(--surface-2);transform:translateY(-1px)}.icon-btn:active{transform:translateY(0) scale(.98)}.main-content{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding:16px}.page{width:100%;max-width:var(--container);margin:0 auto}.page--wide{max-width:var(--container-wide)}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-1);transition:box-shadow .16s var(--ease),transform .16s var(--ease)}.card:hover{box-shadow:var(--shadow-2)}.btn{border:1px solid var(--border);border-radius:12px;padding:10px 14px;background:var(--surface);color:var(--text);cursor:pointer;transition:transform .14s var(--ease),background .14s var(--ease)}.btn:hover{background:var(--surface-2)}.btn:active{transform:scale(.98)}.btn-primary{border:none;background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#083a20}.input,.textarea{width:100%;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:12px;padding:12px 14px;outline:none}.textarea{resize:none}.input:focus,.textarea:focus{border-color:color-mix(in oklab,var(--primary),var(--border) 60%)}.bottom-nav{position:fixed;inset-inline:0;inset-block-end:0;height:var(--bottom-nav-h);background:color-mix(in oklab,var(--surface),transparent 2%);border-top:1px solid var(--border);display:flex;justify-content:space-around;align-items:center;z-index:50;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.nav-item{text-decoration:none;display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 12px;border-radius:14px;color:var(--muted);transition:background .14s var(--ease),color .14s var(--ease)}.nav-item:hover{background:var(--surface-2);color:var(--text)}.nav-item.active{color:var(--primary);background:color-mix(in oklab,var(--primary),transparent 90%)}.nav-text{font-size:11px;font-weight:700}.nav-icon-wrap{position:relative;display:grid;place-items:center}.notif-badge{position:absolute;top:-2px;inset-inline-end:-2px;width:10px;height:10px;border-radius:999px;background:#ff3b30;border:2px solid var(--surface)}.fab-btn{position:fixed;width:56px;height:56px;border-radius:999px;border:none;display:grid;place-items:center;background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#083a20;box-shadow:var(--shadow-2);cursor:pointer;z-index:60;inset-block-end:calc(var(--bottom-nav-h) + 18px);inset-inline-end:18px;transition:transform .16s var(--ease),box-shadow .16s var(--ease)}.fab-btn:hover{transform:translateY(-2px) scale(1.04)}.fab-btn:active{transform:translateY(0) scale(.98)}.modal-overlay{position:fixed;inset:0;background:#0000008a;display:flex;align-items:center;justify-content:center;z-index:100;padding:16px}.modal{width:100%;max-width:520px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-2);overflow:hidden}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--border)}.modal-header h3{margin:0;font-size:16px}.modal-body{padding:16px}.comments-modal{max-width:560px}.comments-body{padding:0}.comments-list{display:flex;flex-direction:column;gap:12px;padding:16px}.comment-item{display:flex;align-items:flex-start;gap:12px}.comment-avatar{width:36px;height:36px;border-radius:999px;object-fit:cover;border:1px solid var(--border)}.comment-bubble{flex:1;background:var(--surface-2);border:1px solid var(--border);border-radius:14px;padding:10px 12px}.comment-author{font-weight:900;font-size:13px;margin-bottom:4px}.comment-text{font-size:14px;line-height:1.5;word-break:break-word}.comments-composer{display:grid;grid-template-columns:1fr auto;gap:10px;padding:12px;border-top:1px solid var(--border)}.comments-composer .btn{padding-inline:16px}.close-btn{width:36px;height:36px;border-radius:999px;border:1px solid var(--border);background:var(--surface);cursor:pointer;display:grid;place-items:center}.empty{padding:32px 12px;color:var(--muted);text-align:center;display:grid;gap:10px;justify-items:center}.posts{display:flex;flex-direction:column;gap:12px}.composer{display:flex;align-items:center;gap:12px;padding:14px;cursor:pointer}.avatar{width:40px;height:40px;border-radius:999px;object-fit:cover;border:1px solid var(--border)}.composer-input{flex:1;background:var(--surface-2);border-radius:999px;padding:10px 14px;color:var(--muted)}.panel-section{padding:16px;border-bottom:1px solid var(--border)}.panel-title{margin:0 0 12px;font-size:14px;color:var(--muted);font-weight:800}.online-users-list{display:flex;flex-direction:column;gap:10px}.online-user-item{display:flex;align-items:center;gap:12px;padding:10px;border-radius:14px;cursor:pointer;position:relative;transition:background .14s var(--ease)}.online-user-item:hover{background:var(--surface-2)}.status-dot{width:10px;height:10px;border-radius:999px;background:var(--primary);border:2px solid var(--surface);position:absolute;inset-inline-start:34px;inset-block-end:10px}.tag-row{display:flex;flex-wrap:wrap;gap:8px}.tag{background:var(--surface-2);border:1px solid var(--border);color:var(--muted);padding:6px 10px;border-radius:999px;cursor:pointer;transition:background .14s var(--ease),color .14s var(--ease)}.tag:hover{background:color-mix(in oklab,var(--primary),transparent 88%);color:var(--text)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}.comm-card{padding:14px;display:grid;gap:10px}.comm-icon{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:color-mix(in oklab,var(--primary),transparent 92%);color:var(--primary)}.comm-name{font-weight:900}.comm-meta{color:var(--muted);font-size:12px}.profile-card{padding:18px;display:grid;gap:14px}.profile-head{display:flex;align-items:center;gap:14px}.profile-name{margin:0;font-size:18px;font-weight:900}.profile-handle{margin:2px 0 0;color:var(--muted);font-size:12px}.profile-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.stat{background:var(--surface-2);border:1px solid var(--border);border-radius:14px;padding:10px;text-align:center}.stat-value{font-weight:900;font-size:16px}.stat-label{font-size:12px;color:var(--muted)}.actions{display:flex;gap:10px;flex-wrap:wrap}.actions .btn{flex:1;min-width:160px}.chat-room-container{display:flex;flex-direction:column;height:100%;background:var(--bg)}.chat-room-header{height:var(--header-h);display:flex;align-items:center;gap:12px;padding-inline:16px;background:color-mix(in oklab,var(--surface),transparent 6%);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:40;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.back-btn{width:40px;height:40px;display:grid;place-items:center;border:none;background:transparent;color:var(--text);cursor:pointer;border-radius:999px;margin-inline-start:-8px}.back-btn:hover{background:var(--surface-2)}.chat-room-avatar{width:40px;height:40px;border-radius:999px;object-fit:cover;border:1px solid var(--border)}.chat-room-info{display:flex;flex-direction:column;line-height:1.2}.chat-room-name{font-weight:900;font-size:15px}.chat-room-status{font-size:11px;color:var(--muted);display:flex;align-items:center;gap:4px}.status-indicator{width:8px;height:8px;border-radius:50%;background-color:var(--muted)}.status-indicator.online{background-color:var(--primary)}.chat-messages-area{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:8px;-webkit-overflow-scrolling:touch}.message-bubble{max-width:75%;padding:8px 12px;border-radius:18px;position:relative;font-size:15px;line-height:1.4;word-wrap:break-word;box-shadow:0 1px 2px #0000000d}.my-msg{align-self:flex-end;background:color-mix(in oklab,var(--primary),transparent 85%);color:var(--text);border-bottom-right-radius:4px}.other-msg{align-self:flex-start;background:var(--surface);border:1px solid var(--border);border-bottom-left-radius:4px}.message-text{margin-bottom:4px}.message-image{max-width:100%;border-radius:12px;margin-bottom:4px}.message-time{font-size:10px;opacity:.6;text-align:right;margin-top:2px}.chat-input-form{padding:10px 16px;background:var(--surface);border-top:1px solid var(--border);display:flex;align-items:center;gap:10px;position:sticky;bottom:0;z-index:40}.chat-input-field{flex:1;background:var(--surface-2);border:1px solid transparent;border-radius:24px;padding:10px 16px;outline:none;font-size:15px;transition:border-color .2s}.chat-input-field:focus{border-color:var(--primary);background:var(--surface)}.attach-btn,.send-btn{width:40px;height:40px;display:grid;place-items:center;border:none;background:transparent;color:var(--muted);cursor:pointer;border-radius:50%;transition:background .2s}.attach-btn:hover{background:var(--surface-2);color:var(--text)}.send-btn{background:var(--primary);color:#083a20}.send-btn:hover{transform:scale(1.05)}@media(max-width:768px){.nav-item{padding:6px 4px}.nav-item svg{width:26px;height:26px}.nav-text{font-size:10px}.icon-btn{width:44px;height:44px}.message-bubble{font-size:16px}}.sidebar-logo{padding:8px 8px 14px}.sidebar-nav{display:flex;flex-direction:column;gap:6px;padding:0 6px;flex:1;overflow:auto}.sidebar-link{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;text-decoration:none;color:var(--muted);transition:background .14s var(--ease),color .14s var(--ease)}.sidebar-link:hover{background:var(--surface-2);color:var(--text)}.sidebar-link.active{background:color-mix(in oklab,var(--primary),transparent 90%);color:var(--primary)}.sidebar-footer{padding:12px 10px;border-top:1px solid var(--border);color:var(--muted);font-size:12px;text-align:center}.posts-container{padding:0}.post-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-1);padding:14px}.post-header{display:flex;align-items:center;gap:12px}.post-avatar{width:44px;height:44px;border-radius:999px;object-fit:cover;border:1px solid var(--border);cursor:pointer}.post-author{font-weight:900;cursor:pointer}.post-time{font-size:12px;color:var(--muted)}.post-text{margin-top:10px;line-height:1.6}.post-image{margin-top:12px;width:100%;max-height:520px;object-fit:cover;border-radius:14px;border:1px solid var(--border)}.post-actions{display:flex;align-items:center;gap:10px;margin-top:12px;padding-top:12px;border-top:1px solid var(--border)}.action-item{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:14px;cursor:pointer;color:var(--muted);transition:background .14s var(--ease),color .14s var(--ease),transform .14s var(--ease)}.action-item:hover{background:var(--surface-2);color:var(--text)}.action-item.liked{color:#e91e63}.action-spacer{margin-inline-start:auto}.stories-bar{display:flex;gap:10px;overflow-x:auto;padding:10px 2px 14px;scrollbar-width:none}.stories-bar::-webkit-scrollbar{display:none}.story-item{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:74px;cursor:pointer}.story-ring,.story-add-ring{width:54px;height:54px;border-radius:999px;display:grid;place-items:center;border:2px solid color-mix(in oklab,var(--primary),transparent 30%);background:var(--surface)}.story-ring img{width:48px;height:48px;border-radius:999px;object-fit:cover}.story-add-icon{width:48px;height:48px;border-radius:999px;display:grid;place-items:center;background:var(--surface-2);color:var(--text);font-weight:900;font-size:20px}.story-name{font-size:12px;color:var(--muted);max-width:74px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.story-video-thumb{width:48px;height:48px;border-radius:999px;display:grid;place-items:center;background:#00000040;color:#fff}.story-viewer-overlay{position:fixed;inset:0;background:#000;z-index:120;display:flex;align-items:center;justify-content:center;overflow:hidden}.story-backdrop{position:absolute;inset:0;opacity:.65;filter:blur(18px);transform:scale(1.1)}.story-backdrop-media{width:100%;height:100%;object-fit:cover}.story-stage{position:relative;width:min(420px,92vw);max-height:80vh;aspect-ratio:9/16;border-radius:16px;overflow:hidden;background:#000;box-shadow:0 24px 80px #00000073}.story-media-wrap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.story-media{width:100%;height:100%;object-fit:contain}.story-progress-multi{position:absolute;top:12px;left:12px;right:12px;display:flex;gap:6px;z-index:3}.story-progress-seg{flex:1;height:3px;background:#ffffff38;border-radius:999px;overflow:hidden}.story-progress-seg-fill{height:100%;background:#fff;transform-origin:left;transform:scaleX(0)}.story-close{position:absolute;top:12px;right:12px;width:40px;height:40px;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:#00000059;color:#fff;cursor:pointer;display:grid;place-items:center;z-index:4}.story-delete{position:absolute;bottom:12px;right:12px;width:40px;height:40px;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:#00000059;color:#fff;cursor:pointer;display:grid;place-items:center;z-index:4}.story-tap-left{position:absolute;top:0;left:0;bottom:0;width:32%;z-index:2}.story-tap-right{position:absolute;top:0;right:0;bottom:0;width:32%;z-index:2}.story-next-btn{position:absolute;top:50%;left:14px;transform:translateY(-50%);width:44px;height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:#00000059;color:#fff;cursor:pointer;display:grid;place-items:center;z-index:4}.story-prev-btn{position:absolute;top:50%;right:14px;transform:translateY(-50%);width:44px;height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:#00000059;color:#fff;cursor:pointer;display:grid;place-items:center;z-index:4}.story-compose-overlay{position:fixed;inset:0;z-index:130;background:#000000a8;display:flex;align-items:center;justify-content:center;padding:16px}.story-compose-modal{width:min(960px,100%);background:var(--surface);border:1px solid var(--border);border-radius:16px;overflow:hidden}.story-compose-top{display:flex;align-items:center;gap:12px;padding:12px 14px;border-bottom:1px solid var(--border)}.story-compose-title{font-weight:900;color:var(--text)}.story-compose-close{width:36px;height:36px;border-radius:999px;border:1px solid var(--border);background:var(--surface-2);color:var(--text);cursor:pointer;display:grid;place-items:center}.story-compose-publish{margin-inline-start:auto;display:flex;align-items:center;gap:8px;height:36px;padding:0 12px;border-radius:999px;border:1px solid color-mix(in oklab,var(--primary),transparent 40%);background:color-mix(in oklab,var(--primary),transparent 80%);color:var(--text);cursor:pointer}.story-compose-publish:disabled{opacity:.5;cursor:not-allowed}.story-compose-body{display:grid;grid-template-columns:1fr 320px;gap:14px;padding:14px}.story-compose-preview{position:relative;height:600px;border-radius:16px;overflow:hidden;background:#000;display:flex;align-items:center;justify-content:center}.story-compose-preview .story-stage{width:auto;height:90%;aspect-ratio:9/16;max-width:100%;box-shadow:0 10px 40px #0000004d}.story-compose-preview .story-backdrop{opacity:.5}.story-compose-tools{display:flex;flex-direction:column;gap:12px}.story-tool-row{display:flex;flex-direction:column;gap:8px}.story-tool-label{display:flex;align-items:center;gap:8px;color:var(--muted);font-weight:700}.story-textarea{width:100%;padding:10px 12px;border-radius:12px;border:1px solid var(--border);background:var(--surface-2);color:var(--text);resize:none}.story-color-row{display:flex;gap:10px;flex-wrap:wrap}.story-color-dot{width:28px;height:28px;border-radius:999px;border:2px solid rgba(255,255,255,.18);cursor:pointer}.story-color-dot.active{outline:2px solid var(--primary);outline-offset:2px}.story-align-row{display:flex;gap:8px}.story-pill{height:34px;padding:0 10px;border-radius:999px;border:1px solid var(--border);background:var(--surface-2);color:var(--text);cursor:pointer}.story-pill.active{border-color:color-mix(in oklab,var(--primary),transparent 30%);background:color-mix(in oklab,var(--primary),transparent 82%)}.story-error{padding:10px 12px;border-radius:12px;border:1px solid rgba(255,0,0,.25);background:#ff000014;color:var(--text)}.story-hint{color:var(--muted);font-size:12px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}.story-hint-sep{opacity:.65}.story-compose-back{margin-top:auto;display:flex;align-items:center;gap:8px;height:38px;padding:0 12px;border-radius:12px;border:1px solid var(--border);background:var(--surface-2);color:var(--text);cursor:pointer}@media(max-width:860px){.story-compose-body{grid-template-columns:1fr}}.story-overlay-text{position:absolute;z-index:3;max-width:92%;transform:translate(-50%,-50%);font-weight:900;text-shadow:0 2px 10px rgba(0,0,0,.65);white-space:pre-wrap;word-break:break-word;-webkit-user-select:none;user-select:none;touch-action:none}.story-overlay-edit{cursor:grab}.story-header-info{position:absolute;inset-block-start:18px;inset-inline-start:14px;display:flex;align-items:center;gap:10px}.story-user-avatar{width:36px;height:36px;border-radius:999px;object-fit:cover;border:2px solid var(--primary)}.story-user-name{color:#fff;font-weight:900;text-shadow:0 1px 2px rgba(0,0,0,.5)}.chat-actions{display:flex;justify-content:flex-end;padding:0 0 12px}.new-chat-btn{display:flex;align-items:center;gap:8px}.chat-list{display:flex;flex-direction:column;gap:8px}.chat-item{display:flex;align-items:center;gap:12px;padding:12px;border-radius:16px;background:var(--surface);border:1px solid var(--border);cursor:pointer;transition:background .14s var(--ease),transform .14s var(--ease)}.chat-item:hover{background:var(--surface-2);transform:translateY(-1px)}.chat-avatar-container{position:relative}.chat-avatar{width:46px;height:46px;border-radius:999px;object-fit:cover;border:1px solid var(--border)}.chat-info{flex:1;min-width:0}.chat-name{font-weight:900}.chat-preview{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}.chat-time{font-size:11px;color:var(--muted)}.chat-room-header{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--border);background:var(--surface)}.back-btn{width:40px;height:40px;border-radius:999px;border:1px solid var(--border);background:var(--surface);cursor:pointer;display:grid;place-items:center}.chat-room-avatar{width:38px;height:38px;border-radius:999px;object-fit:cover;border:1px solid var(--border)}.chat-room-name{font-weight:900}.chat-messages-area{flex:1;min-height:0;overflow-y:auto;padding:14px 14px 96px;display:flex;flex-direction:column;gap:10px}.message-bubble{max-width:78%;padding:10px 12px;border-radius:16px;border:1px solid var(--border)}.my-msg{align-self:flex-end;background:color-mix(in oklab,var(--primary),transparent 84%);border-color:color-mix(in oklab,var(--primary),var(--border) 70%)}.other-msg{align-self:flex-start;background:var(--surface)}.message-time{margin-top:6px;font-size:10px;color:var(--muted);text-align:end}.chat-input-form{display:flex;align-items:center;gap:10px;padding:12px 14px;border-top:1px solid var(--border);background:var(--surface);position:sticky;bottom:0;z-index:60;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))}.chat-input-field{flex:1;border:1px solid var(--border);border-radius:999px;padding:12px 14px;background:var(--surface-2);outline:none;font-size:16px}.send-btn{width:44px;height:44px;border-radius:999px;border:none;background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#083a20;cursor:pointer;display:grid;place-items:center}.attach-btn{width:44px;height:44px;border-radius:999px;border:1px solid var(--border);background:var(--surface);cursor:pointer;display:grid;place-items:center}.notifications-list{display:flex;flex-direction:column;gap:8px}.notification-item{display:flex;align-items:center;gap:12px;padding:12px;border-radius:16px;background:var(--surface);border:1px solid var(--border);cursor:pointer;transition:background .14s var(--ease)}.notification-item:hover{background:var(--surface-2)}.notification-item.unread{border-color:color-mix(in oklab,var(--primary),var(--border) 70%)}.notification-avatar{width:44px;height:44px;border-radius:999px;object-fit:cover;border:1px solid var(--border)}.notification-content{flex:1;min-width:0}.notification-text{font-weight:700;line-height:1.35}.notification-time{margin-top:4px;font-size:11px;color:var(--muted)}.notification-dot{width:10px;height:10px;border-radius:999px;background:var(--primary)}@media(min-width:1024px){#app-screen{display:grid;grid-template-columns:260px minmax(0,1fr) 320px;height:100dvh}.sidebar{display:flex;flex-direction:column;background:var(--surface);border-inline-end:1px solid var(--border);padding:18px;overflow:hidden}.chat-panel{display:flex;flex-direction:column;background:var(--surface);border-inline-start:1px solid var(--border);overflow:auto}.bottom-nav{display:none}.fab-btn{inset-block-end:22px;inset-inline-end:22px}}#auth-screen{height:100dvh;overflow:auto;background:linear-gradient(135deg,var(--bg),color-mix(in oklab,var(--primary),transparent 94%))}.auth-container{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px}.auth-header{text-align:center;margin-bottom:18px}.app-title{margin:0;font-weight:900;font-size:34px;letter-spacing:-.5px}.app-title span{color:var(--primary)}.auth-subtitle{margin:6px 0 0;color:var(--muted);font-size:13px}.auth-box{width:100%;max-width:420px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-2);padding:18px;display:grid;gap:12px}.auth-box h2{margin:0 0 4px;font-size:18px}.input-group{display:grid;gap:8px}.auth-input{width:100%;background:var(--surface-2);color:var(--text);border:1px solid var(--border);border-radius:12px;padding:12px 14px;outline:none}.auth-input:focus{border-color:color-mix(in oklab,var(--primary),var(--border) 60%)}.auth-btn{width:100%;border:0;border-radius:12px;padding:12px 14px;cursor:pointer;font-weight:900;transition:transform .14s var(--ease),filter .14s var(--ease)}.auth-btn:active{transform:scale(.99)}.primary-btn{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#083a20}.auth-footer{display:flex;justify-content:center;gap:6px;color:var(--muted);font-size:13px}.toggle-link{color:var(--primary);cursor:pointer;font-weight:900}.error-message{background:color-mix(in oklab,var(--danger),transparent 90%);border:1px solid color-mix(in oklab,var(--danger),transparent 75%);color:var(--danger);padding:10px 12px;border-radius:12px;font-size:13px}.fade-in{animation:fadeIn .22s var(--ease)}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.comment-thread{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.comment-item{display:flex;gap:10px}.comment-avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;flex-shrink:0}.comment-content-wrapper{flex:1;display:flex;flex-direction:column;gap:2px}.comment-bubble{background:var(--surface-2);padding:8px 12px;border-radius:16px 4px 16px 16px;align-self:flex-start}.comment-author{font-weight:700;font-size:13px;margin-bottom:2px}.comment-text{font-size:14px;line-height:1.4;white-space:pre-wrap}.comment-actions{display:flex;align-items:center;gap:12px;padding-left:8px;margin-top:2px}.comment-action-btn{font-size:12px;font-weight:600;color:var(--muted);cursor:pointer;display:flex;align-items:center;gap:4px}.comment-action-btn:hover{color:var(--text);text-decoration:underline}.comment-time{font-size:11px;color:var(--muted)}.comments-footer{border-top:1px solid var(--border);padding:12px;background:var(--surface)}.replying-bar{display:flex;align-items:center;justify-content:space-between;background:var(--surface-2);padding:6px 12px;border-radius:8px;margin-bottom:8px;font-size:12px;color:var(--muted)}.replying-bar button{background:none;border:none;cursor:pointer;color:var(--text);display:flex;align-items:center}.modal-overlay.inline-mode{position:static;background:transparent;padding:0;z-index:0}.modal.comments-modal.inline-modal{max-width:100%;height:auto;border:none;box-shadow:none;border-radius:0}.inline-modal .comments-list{max-height:none;padding:0}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}@media(min-width:640px){.grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}}@media(max-width:1023px){.chat-list{display:flex;flex-direction:column}.chat-room-mobile-overlay{position:fixed;inset:0;z-index:200;background:var(--surface);display:flex;flex-direction:column}}.communities-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;padding-bottom:20px}.comm-card-new{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:16px;cursor:pointer;transition:transform .2s,box-shadow .2s}.comm-card-new:active{transform:scale(.98)}.comm-card-header{display:flex;align-items:center;gap:12px;margin-bottom:12px}.comm-icon-large{width:56px;height:56px;border-radius:14px;background:var(--surface-2);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}.comm-icon-large img{width:100%;height:100%;object-fit:cover}.comm-info{flex:1;min-width:0}.comm-name{font-weight:700;font-size:16px;margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.comm-stats{display:flex;gap:10px;font-size:12px;color:var(--muted)}.comm-stat-item{display:flex;align-items:center;gap:4px}.comm-desc{font-size:13px;color:var(--text-secondary);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.fab-btn{position:fixed;bottom:80px;left:20px;width:56px;height:56px;border-radius:28px;background:var(--primary);color:#fff;border:none;box-shadow:0 4px 12px rgba(var(--primary-rgb),.4);display:flex;align-items:center;justify-content:center;z-index:50;cursor:pointer;transition:transform .2s}.fab-btn:active{transform:scale(.9)}[dir=rtl] .fab-btn{left:20px;right:auto}[dir=ltr] .fab-btn{right:20px;left:auto}@media(max-width:600px){.communities-grid{grid-template-columns:1fr}}