body{display:block;margin:0}.charlimit-container{min-height:100vh;display:flex;justify-content:center;align-items:center;background:linear-gradient(to bottom,#1e293b,#0f172a);color:#fff;padding:2rem;font-family:sans-serif}.charlimit-box{background-color:#334155;padding:2rem;border-radius:1rem;max-width:640px;width:100%;box-shadow:0 10px 20px #00000040}.charlimit-title{font-size:2rem;text-align:center;margin-bottom:2rem}.charlimit-accent{color:#818cf8}.charlimit-section{margin-top:1.75rem;margin-bottom:1.75rem}.charlimit-section label{display:block;margin-bottom:.5rem;font-weight:500}.charlimit-input,.charlimit-textarea{width:100%;padding:.5rem .75rem;border:1px solid #475569;border-radius:.375rem;background-color:#1e293b;color:#fff;font-size:1rem;box-sizing:border-box}.charlimit-input:focus,.charlimit-textarea:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 2px #6366f14d}.charlimit-textarea{resize:vertical}.charlimit-textarea.readonly{background-color:#1e293b;border-color:#475569;color:#e2e8f0}.charlimit-button,.copy-btn{display:block;width:100%;padding:.75rem;font-size:1rem;border:none;border-radius:.5rem;cursor:pointer;margin-top:.75rem}.charlimit-button{background-color:#6366f1;color:#fff}.charlimit-button:hover{background-color:#4f46e5}.copy-btn{background-color:#4ade80;color:#1f2937}.copy-btn:hover{background-color:#22c55e}.footer{padding:1.5rem;background-color:#f0f0f0;text-align:center;font-size:.9rem;color:#333;border-top:1px solid #ccc}.footer nav a{margin:0 .5rem;text-decoration:none;color:#07c}.footer nav a:hover{text-decoration:underline}