.writing-container{color:#1e293b;background:linear-gradient(135deg,#f0f9ff 0%,#e0f7fa 50%,#e3f2fd 100%);flex-direction:column;align-items:center;min-height:100vh;padding:2rem;font-family:Segoe UI,system-ui,-apple-system,sans-serif;display:flex}.writing-content{width:100%;max-width:800px}.writing-header{text-align:center;margin-bottom:3rem}.writing-title{background:linear-gradient(135deg,#0d9488 0%,#0891b2 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:1rem;font-size:2.5rem;font-weight:800}.writing-subtitle{color:#64748b;max-width:600px;margin:0 auto;font-size:1.1rem;line-height:1.6}.input-group{background:#fff;border:1px solid #06b6d433;border-radius:24px;margin-bottom:2rem;padding:2rem;box-shadow:0 15px 40px #06b6d41a}.input-label{color:#0f766e;margin-bottom:1rem;font-size:1.1rem;font-weight:600;display:block}.topic-input{color:#1e293b;background:#fff;border:2px solid #06b6d433;border-radius:16px;width:100%;margin-bottom:1.5rem;padding:1rem 1.5rem;font-size:1rem;transition:all .3s;box-shadow:0 2px 10px #06b6d40d}.topic-input:focus{border-color:#22c55e;outline:none;box-shadow:0 0 0 4px #22c55e1a}.topic-input::placeholder{color:#94a3b8;font-style:italic}.button-group{gap:1rem;display:flex}.generate-button,.clear-button{cursor:pointer;text-align:center;border:none;border-radius:16px;flex:1;min-height:56px;padding:1rem 2rem;font-size:1rem;font-weight:600;transition:all .3s}.generate-button{color:#fff;background:linear-gradient(135deg,#22c55e 0%,#0d9488 100%);box-shadow:0 4px 20px #22c55e4d}.generate-button:hover:not(:disabled){background:linear-gradient(135deg,#16a34a 0%,#0d9488 100%);transform:translateY(-3px);box-shadow:0 8px 30px #22c55e66}.clear-button{color:#fff;background:linear-gradient(135deg,#06b6d4 0%,#0891b2 100%);box-shadow:0 4px 20px #06b6d44d}.clear-button:hover{background:linear-gradient(135deg,#0891b2 0%,#0e7490 100%);transform:translateY(-3px);box-shadow:0 8px 30px #06b6d466}.generate-button:disabled{opacity:.6;cursor:not-allowed;background:linear-gradient(135deg,#94a3b8,#64748b);transform:none!important}.writing-error{color:#ef4444;text-align:center;background:linear-gradient(135deg,#fee2e2 0%,#fecaca 100%);border:1px solid #fca5a5;border-radius:16px;margin-top:1.5rem;padding:1rem 1.5rem;font-weight:500;animation:.3s slideIn}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.output-section{background:#fff;border:1px solid #06b6d433;border-radius:24px;padding:2rem;animation:.5s ease-out fadeIn;box-shadow:0 15px 40px #06b6d41a}.generated-text{color:#1e293b;white-space:pre-wrap;background:linear-gradient(135deg,#22c55e05,#06b6d405);border-radius:12px;min-height:200px;padding:1rem;font-family:Georgia,serif;font-size:1.05rem;line-height:1.7}.generated-text p{margin-bottom:1rem}.generated-text p:last-child{margin-bottom:0}.generated-text strong{color:#0f766e;font-weight:600}.generated-text em{color:#64748b;font-style:italic}.empty-output{text-align:center;color:#64748b;padding:3rem 1rem}.empty-icon{opacity:.5;margin-bottom:1.5rem;font-size:3rem;animation:3s ease-in-out infinite float}.writing-tips{color:#475569;background:linear-gradient(135deg,#22c55e0d,#06b6d40d);border:1px solid #06b6d426;border-radius:20px;margin-top:2rem;padding:1.5rem;font-size:.95rem;line-height:1.6}.tips-title{color:#0f766e;margin-bottom:1rem;font-size:1.1rem;font-weight:700}.tips-list{margin:0;padding:0;list-style:none}.tips-list li{align-items:flex-start;gap:.75rem;margin-bottom:.75rem;display:flex}.tips-list li:before{content:"→";color:#22c55e;flex-shrink:0;margin-top:1px;font-size:1.1rem;font-weight:700}.tips-list li:last-child{margin-bottom:0}@media (max-width:768px){.writing-container{padding:1rem}.writing-title{font-size:2rem}.writing-subtitle{font-size:1rem}.input-group,.output-section{padding:1.5rem}.button-group{flex-direction:column}.generate-button,.clear-button{width:100%}.topic-input{padding:.875rem 1.25rem;font-size:.95rem}}