*{box-sizing:border-box;margin:0;padding:0}body{font-size:14px;line-height:1.4}
header{display:flex;justify-content:space-between;align-items:center;padding:10px 20px;background:#111;border-bottom:2px solid var(--primary)}
.logo{font-size:24px;color:var(--primary);text-shadow:0 0 10px var(--primary)}.announcement{color:#aaa;font-style:italic}
.user-bar a,.user-bar button{margin-left:10px;color:#fff;background:var(--primary);padding:5px 10px;text-decoration:none;border:none;cursor:pointer}
.role-admin{color:#ff0000;text-shadow:0 0 5px #ff0000}.role-moderator{color:#00ff00}
.shoutbox-wrap{background:#1a1a1a;margin:10px;padding:10px;border:1px solid var(--primary)}#shoutbox{max-height:150px;overflow-y:auto;margin:10px 0}
.shout{display:flex;gap:8px;margin-bottom:4px}.time{color:#666;font-size:11px}
.room-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:15px;padding:20px}
.room-card{background:#1a1a1a;border:1px solid #333;padding:20px;text-align:center;text-decoration:none;color:#fff;transition:0.2s}
.room-card:hover{border-color:var(--primary);box-shadow:0 0 15px var(--primary)}
.chat-container{display:flex;height:calc(100vh - 200px)}.chat-sidebar{width:250px;background:#111;padding:15px;border-right:1px solid #333}
.chat-main{flex:1;display:flex;flex-direction:column}.chat-messages{flex:1;overflow-y:auto;padding:15px;background:#0d0d0d}
.chat-msg{margin-bottom:10px}.chat-msg.user{font-weight:bold;color:var(--primary)}.chat-msg.time{color:#555;font-size:11px;margin-left:8px}
#chat-form{display:flex;padding:10px;background:#111;border-top:1px solid #333}#chat-form input{flex:1;padding:8px;background:#222;border:1px solid #333;color:#fff}
#chat-form button{background:var(--primary);border:none;padding:8px 15px;color:#fff;cursor:pointer}
footer{background:#111;padding:20px;margin-top:40px;border-top:2px solid var(--primary);text-align:center}
.online-user{margin:0 5px;padding:2px 5px;background:#222;border-radius:3px}.admin-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:20px;padding:20px}
.admin-card{background:#1a1a1a;border:1px solid var(--primary);padding:15px}.admin-card table{width:100%;border-collapse:collapse}
.admin-card td,.admin-card th{border:1px solid #333;padding:5px;text-align:left}.profile-container{padding:20px;max-width:800px;margin:auto}
.profile-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.full{grid-column:1/-1}
.profile-grid input,.profile-grid select,.profile-grid textarea{width:100%;padding:8px;background:#222;border:1px solid #333;color:#fff}
.themes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px;padding:20px}.theme-card{padding:20px;text-align:center}
.theme-preview{font-size:40px;font-weight:bold;margin:15px 0;opacity:0.3}.shoutbox-full{padding:20px;max-width:900px;margin:auto}
.shout-full{padding:8px;border-bottom:1px solid #222}.pagination{margin-top:20px}.pagination a{padding:5px 10px;background:#222;margin:2px;color:#fff;text-decoration:none}
.pagination a.active{background:var(--primary)}.chat-tools button{background:#333;border:1px solid #555;color:#fff;padding:5px 10px;margin-right:5px;cursor:pointer}
#emoji-picker{position:absolute;background:#111;border:1px solid var(--primary);padding:10px;display:grid;grid-template-columns:repeat(8,1fr);gap:5px;z-index:999;max-height:200px;overflow-y:auto}
@media(max-width:768px){.chat-container{flex-direction:column;height:auto}.chat-sidebar{width:100%;border-right:none;border-bottom:1px solid #333}.room-grid{grid-template-columns:repeat(2,1fr)}}