:root{--emerald: #10b981;--gold: #fbbf24;--dark-bg: #0a0a0a;--card-bg: #111113;--text: #f1f1f1;--text-muted: #a3a3a3;--input-bg: #1f1f23;--accent: var(--emerald);--border: #222226;--shadow: rgba(0, 0, 0, .4);--radius: 12px;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem}[data-theme=light]{--dark-bg: #f8f9fa;--card-bg: #ffffff;--text: #111113;--text-muted: #555;--input-bg: #f1f1f1;--border: #ddd;--shadow: rgba(0, 0, 0, .08)}*{box-sizing:border-box;margin:0;padding:0}html,body{max-width:100vw;overflow-x:hidden;background:var(--dark-bg);color:var(--text);font-family:Inter,system-ui,sans-serif;line-height:1.5;min-height:100vh}body{display:flex;flex-direction:column}header{grid-area:header;position:relative;display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md);border-bottom:1px solid var(--border);background:var(--dark-bg);z-index:10}header h1{font-size:1.8rem;flex:1;text-align:center}header>div{display:flex;align-items:center;gap:var(--spacing-md)}header button{background:none;border:none;color:var(--text);font-size:1.5rem;padding:8px;border-radius:50%;cursor:pointer}header button:hover{background:#10b98126}.hamburger{background-color:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--gold)}.hamburger:before{content:"☰";font-size:2rem}.hamburger.show:before{content:"×";font-size:2rem}#notifications-dropdown{position:fixed;top:60px;left:50%;transform:translate(-50%);background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 8px 30px var(--shadow);z-index:300;width:90%;max-width:420px;max-height:65vh;overflow-y:auto;display:none;padding:var(--spacing-md);border-bottom-left-radius:0;border-bottom-right-radius:0}@media(min-width:769px){#notifications-dropdown{position:absolute;top:70px;left:auto;right:20px;transform:none;width:320px;max-height:420px}}#notifications-dropdown.show{display:block;animation:slideDown .2s ease forwards}@keyframes slideDown{0%{opacity:0;transform:translate(-50%,-10px)}to{opacity:1;transform:translate(-50%)}}#notifications-dropdown button{padding:10px 16px;margin-right:8px;border-radius:8px;background:var(--input-bg);color:var(--text);border:1px solid var(--border)}#notifications-dropdown .unread{background:#10b9811a;padding:12px;border-left:4px solid var(--emerald);margin-bottom:8px;border-radius:8px}#tab-bar{position:fixed;bottom:0;left:0;width:100%;height:60px;background:var(--card-bg);border-top:1px solid var(--border);display:flex;justify-content:space-around;align-items:center;z-index:102;box-shadow:0 -2px 8px var(--shadow)}#tab-bar a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text);font-size:1.65rem;text-decoration:none;cursor:pointer}#tab-bar a .tab-label{font-size:.7rem;margin-top:2px;display:none}#tab-bar a:active,#tab-bar a:focus{color:var(--emerald)}#nav-list a{display:none;padding:14px 24px;color:var(--text);align-items:center;gap:12px;font-size:1.1rem;text-decoration:none;cursor:pointer}#nav-list.show a{display:flex}#nav-list a:hover,#nav-list a[aria-current=page]{background:#10b9811a;color:var(--emerald)}main{flex:1;padding:var(--spacing-md);overflow-y:auto;margin-bottom:70px}@media(min-width:769px){main{padding:var(--spacing-xl);max-width:700px;margin:0 auto}}.post-card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);padding:var(--spacing-lg);margin-bottom:var(--spacing-lg)}.post-card .post-actions{display:flex;justify-content:space-between;align-items:center;margin-top:var(--spacing-md);padding-top:var(--spacing-md);border-top:1px solid var(--border);flex-wrap:wrap;gap:8px}.post-card button{background:none;border:none;font-size:1.4rem;padding:6px 10px;border-radius:50%;cursor:pointer}.post-card button:hover{background:#10b9811a;color:var(--emerald);transform:scale(1.15)}#messages-container{padding:var(--spacing-md);min-height:calc(100vh - 180px);overflow-y:auto}.chat-item{display:flex;align-items:center;gap:12px;padding:16px;border-bottom:1px solid var(--border);cursor:pointer;background:var(--card-bg);margin-bottom:var(--spacing-sm);border-radius:var(--radius)}.chat-item:hover,.chat-item:active{background:#10b98114}.chat-avatar{font-size:2rem;width:48px;height:48px;background:var(--input-bg);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}.chat-info{flex:1;min-width:0}.chat-info strong{display:block;font-size:1.05rem}.chat-info small{color:var(--text-muted)}.last-message{color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#chat-window{height:calc(100vh - 130px);display:flex;flex-direction:column}#chat-messages{flex:1;overflow-y:auto;padding:var(--spacing-md);background:var(--dark-bg);display:flex;flex-direction:column;gap:12px}.message-bubble{max-width:80%;padding:12px 16px;border-radius:18px;line-height:1.4}.message-bubble.mine{align-self:flex-end;background:var(--emerald);color:#fff;border-bottom-right-radius:4px}.message-bubble.theirs{align-self:flex-start;background:var(--input-bg);border-bottom-left-radius:4px}@media(max-width:768px){#chat-window.hidden,#chats-list.hidden{display:none!important}}@media(max-width:380px){.post-actions button{font-size:1.25rem}}.hidden{display:none!important}#load-more{display:block;margin:var(--spacing-md) auto;padding:var(--spacing-sm) var(--spacing-md);background:var(--accent);color:#fff;border:none;border-radius:8px}#notifications-bell{position:relative}#notif-count{position:absolute;top:-4px;right:-4px;background:#ef4444;color:#fff;font-size:.75rem;font-weight:700;min-width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center;padding:0 5px;box-shadow:0 0 0 2px var(--dark-bg)}#tab-bar a[data-view=messages]{position:relative}#tab-bar a[data-view=messages]:after{content:"";position:absolute;top:8px;right:25%;width:9px;height:9px;background:#10b981;border-radius:50%;border:2px solid var(--card-bg);display:none;box-shadow:0 0 0 2px var(--dark-bg)}#tab-bar a[data-view=messages].has-unread:after{display:block}@media screen and (min-width:43.75rem){#tab-bar,.hamburger{display:none}#nav-list{display:flex;flex-direction:column;position:fixed;gap:20px}#nav-list a{display:flex;flex-direction:row;text-decoration:none;padding:10px}}
