body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.app-container{min-height:100vh;background:linear-gradient(135deg,#e0e7ff,#f3f4f6);display:flex;justify-content:center;align-items:center;padding:16px}.card{background:#fff;border-radius:16px;box-shadow:0 10px 20px #0000001a;padding:32px;max-width:600px;width:100%;transition:box-shadow .3s ease}.card:hover{box-shadow:0 15px 30px #00000026}.card h1{font-size:2rem;font-weight:800;text-align:center;background:linear-gradient(90deg,#4f46e5,#7c3aed);-webkit-background-clip:text;color:transparent;margin-bottom:24px}.input-container{margin-bottom:24px}.input-container label{display:block;font-size:1.125rem;font-weight:600;color:#374151;margin-bottom:8px}.input-container input{width:100%;padding:12px;border-radius:8px;border:1px solid #d1d5db;background:#f9fafb;font-size:1rem;color:#111827;outline:none;transition:border-color .3s,box-shadow .3s}.input-container input:focus{border-color:#4f46e5;box-shadow:0 0 0 2px #4f46e533}.char-count{font-size:.875rem;color:#6b7280;text-align:right;margin-top:4px}.metrics{display:flex;flex-direction:column;gap:24px}.metric h3{font-size:1rem;font-weight:600;color:#374151;margin-bottom:8px;display:flex;justify-content:space-between}.progress-bar{width:100%;background:#e5e7eb;border-radius:9999px;height:12px;overflow:hidden}.progress{height:100%;transition:width .3s ease}.progress.length{background:linear-gradient(90deg,#3b82f6,#1d4ed8)}.progress.keyword{background:linear-gradient(90deg,#10b981,#047857)}.progress.emotional{background:linear-gradient(90deg,#8b5cf6,#6d28d9)}.progress.clarity{background:linear-gradient(90deg,#ef4444,#b91c1c)}.metric p{font-size:.875rem;color:#6b7280;margin-top:4px}.overall-score{text-align:center;font-size:1.125rem;font-weight:600;color:#374151;margin-top:24px}