*{box-sizing:border-box}#title{margin-left:auto;margin-right:auto}:root{color:#222;background:#f4f5f7;font-family:Arial,sans-serif}body{margin:0}button{color:#fff;cursor:pointer;background:#16a34a;border:0;border-radius:4px;padding:.55rem .9rem}button:hover{background:#15803d}.page{width:min(100% - 2rem,48rem);margin:0 auto;padding:2rem 0}.page-header{text-align:center;margin-bottom:1.5rem}.post-form{gap:.5rem;max-width:32rem;margin:0 auto;display:grid}.post-form input,.post-form textarea{width:100%;font:inherit;border:1px solid #bbb;border-radius:4px;padding:.6rem}.post-form textarea{resize:vertical}.form-actions{gap:.75rem;margin-top:.5rem;display:flex}.error-popup{color:#b42318;background:#fff;border:1px solid #b42318;border-radius:4px;align-items:center;gap:1rem;max-width:24rem;padding:1rem;display:flex;position:fixed;bottom:1rem;right:1rem}.error-popup p{margin:0}.error-popup button{background:#b42318}.posts{gap:1rem;display:grid}.post{background:#fff;border:1px solid #ddd;border-radius:4px;padding:1rem}.post-meta{color:#666;justify-content:space-between;gap:1rem;font-size:.875rem;display:flex}.post h2{margin:.75rem 0 .5rem}.post img{max-width:100%;margin-top:.5rem;display:block}.post p{margin:0;line-height:1.5}.post-reactions{gap:.75rem;margin-top:1rem;display:flex}.post-reactions button{background:#2563eb}button:disabled{cursor:not-allowed;opacity:.6}.post-reactions button:hover{background:#1d4ed8}.empty-state{color:#666}
