:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background:linear-gradient(135deg,#1a1a2e,#16213e);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}.container{background:#ffffff0d;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:3rem;box-shadow:0 8px 32px #0000005e;transition:transform .3s ease}.title{font-size:3.2em;line-height:1.1;margin-bottom:2rem;background:linear-gradient(to right,#00d2ff,#3a7bd5);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-weight:800}.input-group{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem}input{background:#ffffff0d;border:2px solid rgba(255,255,255,.1);padding:1rem 1.5rem;border-radius:12px;font-size:1.1rem;color:#fff;transition:all .3s ease;outline:none}input:focus{border-color:#00d2ff;background:#ffffff1a;box-shadow:0 0 15px #00d2ff4d}button{border-radius:12px;border:none;padding:1rem 2rem;font-size:1.1rem;font-weight:600;font-family:inherit;background:linear-gradient(45deg,#00d2ff,#3a7bd5);color:#fff;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #00d2ff33}button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #00d2ff4d}button:active{transform:translateY(0)}.error{color:#ff4d4d;font-size:.9rem;margin-top:-.5rem;margin-bottom:1rem;min-height:1.2rem}.display-area{margin-top:3rem;padding:2rem;border-top:1px solid rgba(255,255,255,.1)}.greeting{font-size:2rem;font-weight:600;animation:fadeIn .5s ease-out}.name-span{color:#00d2ff;text-shadow:0 0 10px rgba(0,210,255,.5)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media(prefers-color-scheme:light){:root{color:#213547;background:linear-gradient(135deg,#f5f7fa,#c3cfe2)}.container{background:#ffffffb3;border:1px solid rgba(0,0,0,.1);box-shadow:0 8px 32px #1f26871a}input{background:#fffc;border:2px solid rgba(0,0,0,.1);color:#213547}input:focus{background:#fff}.name-span{color:#3a7bd5}}