@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Outfit:wght@300;400;500;600;700;800;900&family=Playfair+Display:ital,wght@0,400;0,700;1,400&display=swap";:root{--font-body:"Inter", sans-serif;--font-heading:"Outfit", sans-serif;--font-serif:"Playfair Display", serif;--primary:#818cf8;--primary-hover:#6366f1;--primary-glow:#818cf866;--bg-main:#020617;--bg-card:#0f172a99;--text-main:#f8fafc;--text-muted:#94a3b8;--border:#ffffff14;--glass-border:#ffffff0d;--shadow-premium:0 20px 25px -5px #0003, 0 10px 10px -5px #0000001a;--radius-2xl:1.5rem}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);background-color:var(--bg-main);color:var(--text-main);background-image:radial-gradient(at 0 0,#0f172a 0,#0000 50%),radial-gradient(at 50% 0,#1e1b4b 0,#0000 50%),radial-gradient(at 100% 0,#312e81 0,#0000 50%),radial-gradient(at 0 100%,#171717 0,#0000 50%),radial-gradient(at 100% 100%,#1e1b4b 0,#0000 50%);background-attachment:fixed;min-height:100vh;line-height:1.6;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:-1;background:radial-gradient(circle,#6366f10d,#0000 40%);width:100%;height:100%;animation:10s ease-in-out infinite alternate mesh-glow;position:fixed;top:0;left:0}@keyframes mesh-glow{0%{transform:translate(-10%,-10%)}to{transform:translate(10%,10%)}}h1,h2,h3,h4{font-family:var(--font-heading);letter-spacing:-.025em;font-weight:800}.glass-card{background:var(--bg-card);-webkit-backdrop-filter:blur(16px)saturate(180%);border:1px solid var(--glass-border);border-radius:var(--radius-2xl);box-shadow:var(--shadow-premium);transition:transform .3s,box-shadow .3s}.btn{cursor:pointer;font-weight:700;font-family:var(--font-heading);border:none;border-radius:.75rem;justify-content:center;align-items:center;gap:.6rem;padding:.8rem 1.8rem;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex}.btn-primary{background:linear-gradient(135deg, var(--primary), var(--primary-hover));color:#fff;box-shadow:0 4px 12px var(--primary-glow)}.btn-primary:hover{box-shadow:0 8px 20px var(--primary-glow);filter:brightness(1.1);transform:translateY(-2px)}.btn-primary:active{transform:translateY(0)}.input-field{border:1px solid var(--border);color:#fff;background:#0f172a66;border-radius:.75rem;width:100%;padding:.85rem 1.1rem;font-size:.9rem;transition:all .2s;box-shadow:inset 0 2px 4px #0000001a}.input-field:focus{border-color:var(--primary);background:#0f172a99;outline:none;box-shadow:0 0 0 3px #818cf826,inset 0 2px 4px #0000001a}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:.6s cubic-bezier(.22,1,.36,1) forwards fadeInUp}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:var(--bg-main)}::-webkit-scrollbar-thumb{background:linear-gradient(var(--bg-main), var(--primary), var(--bg-main));border:3px solid var(--bg-main);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--primary-hover)}.app-container{grid-template-columns:1fr 1.2fr;gap:2rem;min-width:0;max-width:1400px;min-height:100vh;margin:0 auto;padding:2rem;display:grid}.preview-wrapper{border-radius:var(--radius-xl);height:calc(100vh - 4rem);box-shadow:var(--shadow-lg);color:#1e293b;background:#fff;min-width:0;position:sticky;top:2rem;overflow-y:auto}.preview-wrapper::-webkit-scrollbar{width:4px}@media (width<=1200px){.app-container{gap:1.5rem;padding:1.5rem}}@media (width<=1024px){.app-container{grid-template-columns:1fr;padding:1rem}.preview-wrapper{height:auto;margin-top:2rem;position:relative;top:0;overflow-y:visible}header h1{font-size:2rem!important}}@media (width<=640px){.app-container{padding:.75rem}header{flex-direction:column;gap:1rem;align-items:flex-start!important}#export-btn{justify-content:center;width:100%}.glass-card{padding:1.25rem!important}.personal-info-grid{grid-template-columns:auto 1fr;align-items:center;gap:2rem;display:grid}html,body,#root,.app-container{margin:0;padding:0;width:100vw!important;max-width:100vw!important;overflow-x:hidden!important}.app-container{flex-direction:column;padding:1rem;display:flex}main,aside{width:100%;min-width:0;max-width:100%}.preview-wrapper{width:100%;max-width:100%;overflow-x:hidden}}@media (width<=480px){.personal-info-grid{grid-template-columns:1fr;gap:1.5rem}.grid-2{grid-template-columns:1fr!important}.btn{padding:.5rem 1rem;font-size:.85rem}}
