:root{--background:#ffffff;--foreground:#171717}@media (prefers-color-scheme:dark){:root{--background:#0a0a0a;--foreground:#ededed}}body,html{max-width:100vw;overflow-x:hidden}body{color:var(--foreground);background:var(--background);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box;padding:0;margin:0}a{color:inherit;text-decoration:none}@media (prefers-color-scheme:dark){html{color-scheme:dark}}.auth-button{padding:8px 16px;border-radius:4px;font-weight:500;cursor:pointer;transition:all .2s ease;border:none;font-size:14px}.login-button{background-color:#2563eb;color:white}.login-button:hover{background-color:#1d4ed8}.logout-button{background-color:#dc2626;color:white}.logout-button:hover{background-color:#b91c1c}.container{max-width:896px;margin:0 auto;padding:1rem;position:relative}.greeting{margin-bottom:1rem}.auth-container{position:absolute;top:1rem;right:1rem}.post-form{max-width:800px;margin:0 auto;padding:20px}.prompt-textarea{width:100%;min-height:200px;padding:12px;margin-bottom:16px;border:1px solid #e2e8f0;border-radius:8px;font-size:16px;resize:vertical}.generate-button{background-color:#3b82f6;color:white;padding:12px 24px;border:none;border-radius:6px;font-size:16px;cursor:pointer;transition:background-color .2s}.generate-button:hover{background-color:#2563eb}.output-container{margin:20px 0;padding:16px;background-color:#f8fafc;border-radius:8px;min-height:100px}.posts-container{display:flex;flex-direction:column;gap:20px;margin-top:24px}.post-box{background-color:white;border:1px solid #e2e8f0;border-radius:8px;padding:16px;box-shadow:0 1px 3px rgba(0,0,0,.1);width:100%}.post-box h3{margin:0 0 12px;color:#1e293b;font-size:18px}.post-textarea{width:100%;min-height:200px;padding:12px;border:1px solid #e2e8f0;border-radius:6px;font-size:14px;line-height:1.5;resize:vertical;background-color:#f8fafc;white-space:pre-wrap}.post-textarea:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 2px rgba(59,130,246,.1)}.images-container{margin-top:32px;padding:16px;background-color:white;border:1px solid #e2e8f0;border-radius:8px;box-shadow:0 1px 3px rgba(0,0,0,.1)}.images-container h3{margin:0 0 16px;color:#1e293b;font-size:18px}.images-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));grid-gap:16px;gap:16px}.generated-image{width:100%;height:200px;object-fit:cover;border-radius:4px;border:1px solid #e2e8f0}.post-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.post-header h3{margin:0}.copy-button{background-color:#f1f5f9;color:#1e293b;padding:6px 12px;border:1px solid #e2e8f0;border-radius:4px;font-size:14px;cursor:pointer;transition:all .2s}.copy-button:hover{background-color:#e2e8f0}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}