@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;700&display=swap";:root{--primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--secondary-gradient: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);--glass-bg: rgba(255, 255, 255, .1);--glass-border: rgba(255, 255, 255, .2);--text-primary: #ffffff;--text-secondary: rgba(255, 255, 255, .7);--bg-dark: #0f172a;--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--transition: all .3s cubic-bezier(.4, 0, .2, 1)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Outfit,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:var(--bg-dark);background-image:radial-gradient(at 0% 0%,rgba(118,75,162,.15) 0,transparent 50%),radial-gradient(at 100% 100%,rgba(102,126,234,.15) 0,transparent 50%);color:var(--text-primary);min-height:100vh;display:flex;justify-content:center;align-items:center;overflow-x:hidden}#app{width:100%;max-width:1200px;padding:2rem}.container{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:start}@media(max-width:768px){.container{grid-template-columns:1fr;gap:2rem}}header{margin-bottom:3rem;text-align:center;grid-column:1 / -1}h1{font-size:3.5rem;font-weight:700;background:var(--primary-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:.5rem;letter-spacing:-1px}.subtitle{font-size:1.2rem;color:var(--text-secondary);font-weight:300}.glass-card{background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:24px;padding:2.5rem;box-shadow:var(--shadow-lg);transition:var(--transition)}.glass-card:hover{transform:translateY(-5px);border-color:#fff6}.upload-section{display:flex;flex-direction:column;gap:1.5rem}.upload-area{width:100%;aspect-ratio:4/5;border:2px dashed var(--glass-border);border-radius:20px;display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;overflow:hidden;position:relative;transition:var(--transition)}.upload-area:hover{background:#ffffff0d;border-color:#667eea}.upload-area.has-image{border-style:solid}#preview-img{width:100%;height:100%;object-fit:cover;display:none}.upload-placeholder{display:flex;flex-direction:column;align-items:center;gap:1rem;color:var(--text-secondary)}.upload-icon{font-size:2.5rem}.form-section{display:flex;flex-direction:column;gap:2rem}.input-group{display:flex;flex-direction:column;gap:.75rem}label{font-size:.9rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}.input-wrapper{position:relative}input[type=number]{width:100%;background:#ffffff0d;border:1px solid var(--glass-border);border-radius:12px;padding:1rem 3.5rem 1rem 1.25rem;color:var(--text-primary);font-family:inherit;font-size:1.1rem;transition:var(--transition)}input[type=number]:focus{outline:none;background:#ffffff1a;border-color:#667eea;box-shadow:0 0 0 4px #667eea33}.unit{position:absolute;right:1.25rem;top:50%;transform:translateY(-50%);color:var(--text-secondary);font-weight:600;pointer-events:none}.btn-submit{width:100%;background:var(--primary-gradient);border:none;border-radius:14px;padding:1.25rem;color:#fff;font-family:inherit;font-size:1.1rem;font-weight:600;cursor:pointer;transition:var(--transition);margin-top:1rem;box-shadow:0 4px 15px #667eea66}.btn-submit:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea99;filter:brightness(1.1)}.btn-submit:active{transform:translateY(0)}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.glass-card{animation:fadeIn .8s ease-out forwards}.upload-section{animation-delay:.2s}.form-section{animation-delay:.4s}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}