:root{font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body{margin:0;padding:0;width:100%;min-height:100vh}body{font-family:Arial,sans-serif;background-color:#f9f9f9;display:flex;justify-content:center}#root{width:100%;display:flex;justify-content:center}:root{--primary-color: #ff6b6b;--secondary-color: #ffe66d;--background-color: #f9f9f9;--text-color: #1a1a1a;--accent-color: #4ecdc4;--border-color: #000000;--border-width: 3px;--shadow-offset: 5px;--border-radius: 0;--font-primary: "Arial", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--background-color);color:var(--text-color);font-family:var(--font-primary);padding:20px}.app-container{max-width:1000px;margin:0 auto;padding:30px;background-color:#fff;border:var(--border-width) solid var(--border-color);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--border-color)}.header{margin-bottom:30px;text-align:center}.header h1{font-size:3rem;font-weight:800;text-transform:uppercase;color:var(--primary-color);text-shadow:3px 3px 0 var(--border-color);margin-bottom:10px;transform:rotate(-2deg)}main{display:flex;flex-direction:column;gap:20px}.text-input-container{width:100%}.text-input{width:100%;padding:20px;font-size:1.2rem;border:var(--border-width) solid var(--border-color);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--border-color);background-color:#fff;resize:vertical;transition:transform .2s;font-family:var(--font-primary);min-height:200px}.text-input:focus{outline:none;transform:translate(-2px,-2px);box-shadow:calc(var(--shadow-offset) + 2px) calc(var(--shadow-offset) + 2px) 0 var(--border-color)}.input-actions{display:flex;gap:15px;margin-top:15px}button{border:var(--border-width) solid var(--border-color);background-color:#fff;padding:10px 20px;font-size:1rem;font-weight:700;cursor:pointer;box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--border-color);transition:transform .2s,box-shadow .2s;text-transform:uppercase}button:hover{background-color:var(--secondary-color)}button:active{transform:translate(var(--shadow-offset),var(--shadow-offset));box-shadow:0 0 0 var(--border-color)}.action-button{background-color:var(--secondary-color)}.conversion-buttons{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:15px;margin:20px 0}.case-button{background-color:var(--accent-color);color:var(--text-color);text-transform:none;font-weight:400}.case-button:nth-child(odd){transform:rotate(1deg)}.case-button:nth-child(2n){transform:rotate(-1deg)}.case-button:nth-child(3n){background-color:var(--primary-color);color:#fff}.case-button:nth-child(3n+1){background-color:var(--secondary-color)}.case-button:hover{transform:scale(1.05);z-index:1}.text-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:15px;margin:20px 0}.stats-box{padding:15px;border:var(--border-width) solid var(--border-color);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--border-color);background-color:var(--secondary-color);display:flex;justify-content:space-between;align-items:center;font-weight:700}.stats-box:nth-child(2n){transform:rotate(1deg)}.stats-box:nth-child(odd){transform:rotate(-1deg)}.stats-value{font-size:1.5rem;font-weight:800}.footer{margin-top:40px;text-align:center;padding:20px;border-top:var(--border-width) dashed var(--border-color);font-weight:700}.donation-link{display:inline-block;margin-top:10px;padding:10px 20px;background-color:var(--primary-color);color:#fff;text-decoration:none;border:var(--border-width) solid var(--border-color);box-shadow:var(--shadow-offset) var(--shadow-offset) 0 var(--border-color);transition:transform .2s,box-shadow .2s;font-weight:800;transform:rotate(-2deg)}.donation-link:hover{transform:rotate(2deg) scale(1.05)}.donation-link:active{transform:translate(var(--shadow-offset),var(--shadow-offset)) rotate(0);box-shadow:0 0 0 var(--border-color)}@media (max-width: 768px){:root{--border-width: 2px;--shadow-offset: 3px}.header h1{font-size:2rem}.app-container{padding:15px}.conversion-buttons,.text-stats{grid-template-columns:1fr 1fr}.text-input{padding:15px;font-size:1rem;min-height:150px}}@media (max-width: 480px){.conversion-buttons,.text-stats{grid-template-columns:1fr}.input-actions{flex-direction:column}}
