@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";:root{--color-bg: #f5f5f7;--color-bg-card: #ffffff;--color-text: #1d1d1f;--color-text-secondary: #6e6e73;--color-accent: #0071e3;--color-accent-hover: #0077ed;--color-border: #d2d2d7;--font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 2rem;--font-size-4xl: 2.5rem;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--spacing-3xl: 4rem;--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--radius-full: 9999px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--transition-fast: .15s ease;--transition-base: .25s ease;--transition-slow: .35s ease;--max-width: 1100px;--header-height: 60px}:root.dark{--color-bg: #0d1117;--color-bg-card: #161b22;--color-text: #e6edf3;--color-text-secondary: #8b949e;--color-accent: #58a6ff;--color-accent-hover: #79b8ff;--color-border: #30363d;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .4), 0 2px 4px -1px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .4), 0 4px 6px -2px rgba(0, 0, 0, .3);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .4), 0 10px 10px -5px rgba(0, 0, 0, .3)}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font-family);font-size:var(--font-size-base);line-height:1.6;color:var(--color-text);background-color:var(--color-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh}a{color:var(--color-accent);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-accent-hover)}img{max-width:100%;height:auto}button{font-family:inherit;cursor:pointer}.container{max-width:var(--max-width);margin:0 auto;padding:0 var(--spacing-lg)}.section{padding:var(--spacing-3xl) 0}.section-title{font-size:var(--font-size-xl);font-weight:600;color:var(--color-text-secondary);margin-bottom:var(--spacing-xl);text-transform:uppercase;letter-spacing:.05em}.card{background:var(--color-bg-card);border-radius:var(--radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-md);transition:transform var(--transition-base),box-shadow var(--transition-base)}.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideIn{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.fade-in{animation:fadeIn .6s ease forwards}.slide-in{animation:slideIn .6s ease forwards}@keyframes marquee{0%{transform:translate(0)}to{transform:translate(-50%)}}.marquee-container{overflow:hidden;white-space:nowrap}.marquee-content{display:inline-flex;animation:marquee 20s linear infinite}.marquee-container:hover .marquee-content{animation-play-state:paused}@media(max-width:768px){:root{--font-size-3xl: 1.75rem;--font-size-4xl: 2rem}.container{padding:0 var(--spacing-md)}.section{padding:var(--spacing-2xl) 0}}.app{min-height:100vh}.main-content{padding-top:var(--header-height)}.hero{display:grid;grid-template-columns:300px 1fr;gap:var(--spacing-2xl);align-items:start;margin-bottom:var(--spacing-3xl)}.hero-sidebar{position:sticky;top:calc(var(--header-height) + var(--spacing-xl))}.hero-image-container{width:200px;height:200px;margin:0 auto var(--spacing-lg);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-lg);background:linear-gradient(135deg,#667eea,#764ba2)}.hero-image{width:100%;height:100%;object-fit:cover}.hero-image-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:4rem;color:#fff;font-weight:600}.hero-info{text-align:center}.hero-name{font-size:var(--font-size-2xl);font-weight:700;margin-bottom:var(--spacing-xs)}.hero-title{font-size:var(--font-size-lg);color:var(--color-accent);font-weight:500;margin-bottom:var(--spacing-xs)}.hero-education{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--spacing-lg)}.hero-socials{display:flex;justify-content:center;gap:var(--spacing-md)}.social-link{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-full);background:var(--color-bg);color:var(--color-text);transition:all var(--transition-fast)}.social-link:hover{background:var(--color-accent);color:#fff;transform:translateY(-2px)}.social-link svg{width:20px;height:20px}.hero-content{padding-top:var(--spacing-xl)}.hero-bio{font-size:var(--font-size-lg);line-height:1.8;color:var(--color-text)}.hero-bio p{margin-bottom:var(--spacing-lg)}.hero-bio.code-block{background:#1e1e1e;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg);font-size:var(--font-size-base);line-height:1.6;max-width:100%;width:100%;position:relative}.code-header{display:flex;align-items:center;gap:8px;padding:12px 16px;background:#323232;border-bottom:1px solid #404040}.code-dot{width:12px;height:12px;border-radius:50%}.code-dot.red{background:#ff5f56}.code-dot.yellow{background:#ffbd2e}.code-dot.green{background:#27c93f}.code-dot.clickable{cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}.code-dot.clickable:hover{transform:scale(1.2);box-shadow:0 0 8px #ff5f5699}.close-warning-overlay{position:absolute;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:10;border-radius:var(--radius-lg)}.close-warning-modal{background:#2d2d2d;padding:var(--spacing-lg);border-radius:var(--radius-md);text-align:center;max-width:300px;box-shadow:0 10px 40px #00000080}.close-warning-modal p{color:#fff;margin-bottom:var(--spacing-sm);font-size:var(--font-size-base)}.close-warning-subtext{color:#888!important;font-size:var(--font-size-sm)!important;margin-bottom:var(--spacing-lg)!important}.close-warning-buttons{display:flex;gap:var(--spacing-sm);justify-content:center}.close-warning-buttons button{padding:var(--spacing-sm) var(--spacing-lg);border:none;border-radius:var(--radius-md);font-weight:500;cursor:pointer;transition:all .15s ease}.btn-stay{background:#4ec9b0;color:#000}.btn-stay:hover{background:#5fd9c0;transform:translateY(-1px)}.btn-leave{background:#444;color:#fff}.btn-leave:hover{background:#555}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-5px)}20%,40%,60%,80%{transform:translate(5px)}}.close-warning-modal.shake{animation:shake .5s ease-in-out}.hero-bio.code-block.window-closed{animation:windowClose .3s ease forwards;pointer-events:none}@keyframes windowClose{0%{transform:scale(1);opacity:1}to{transform:scale(.1);opacity:0}}.code-filename{margin-left:auto;font-size:var(--font-size-sm);color:#888;font-family:SF Mono,Monaco,Consolas,monospace}.code-content{margin:0;padding:var(--spacing-lg);font-family:SF Mono,Monaco,Consolas,Liberation Mono,monospace;font-size:.9rem;overflow-x:auto;white-space:pre-wrap;word-wrap:break-word}.code-content code{display:block;color:#d4d4d4}.code-content .tag{color:#569cd6}.code-content .text{color:#ce9178}.code-content .highlight{color:#4ec9b0;font-weight:600}.code-content .attr{color:#9cdcfe}.education-cards{display:flex;gap:var(--spacing-lg)}.education-card{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-lg);background:var(--color-bg-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-md)}.education-logo{width:60px;height:60px;display:flex;align-items:center;justify-content:center;background:#0a2e52;border-radius:var(--radius-md);color:#fff;font-weight:700;font-size:var(--font-size-xl)}.education-info h3{font-size:var(--font-size-lg);font-weight:600;margin-bottom:var(--spacing-xs)}.education-info p{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.experience-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--spacing-lg)}.experience-card{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-lg);background:var(--color-bg-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);transition:all var(--transition-base)}.experience-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.experience-logo{width:50px;height:50px;display:flex;align-items:center;justify-content:center;background:var(--color-bg);border-radius:var(--radius-md);font-weight:700;font-size:var(--font-size-lg);flex-shrink:0}.experience-info h3{font-size:var(--font-size-base);font-weight:600;margin-bottom:var(--spacing-xs)}.experience-info p{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.portfolio-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--spacing-lg);margin-bottom:var(--spacing-3xl)}.portfolio-card{background:var(--color-bg-card);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-md);cursor:pointer;transition:all var(--transition-base)}.portfolio-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-xl)}.portfolio-image{width:100%;height:180px;background:linear-gradient(135deg,#1a1a2e,#16213e);display:flex;align-items:center;justify-content:center;color:#fff;font-size:var(--font-size-3xl)}.portfolio-content{padding:var(--spacing-lg)}.portfolio-content h3{font-size:var(--font-size-lg);font-weight:600;margin-bottom:var(--spacing-sm)}.portfolio-content p{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--spacing-md)}.portfolio-tags{display:flex;flex-wrap:wrap;gap:var(--spacing-sm)}.portfolio-tag{padding:var(--spacing-xs) var(--spacing-sm);background:var(--color-bg);border-radius:var(--radius-full);font-size:var(--font-size-xs);color:var(--color-text-secondary)}.tech-stack{padding:var(--spacing-xl) 0}.tech-stack-title{font-size:var(--font-size-lg);font-weight:600;color:var(--color-text-secondary);margin-bottom:var(--spacing-lg);text-align:center}.tech-marquee{overflow:hidden;padding:var(--spacing-md) 0;mask-image:linear-gradient(to right,transparent,black 10%,black 90%,transparent);-webkit-mask-image:linear-gradient(to right,transparent,black 10%,black 90%,transparent)}.tech-marquee-inner{display:flex;gap:var(--spacing-2xl);animation:marquee 25s linear infinite;width:max-content}.tech-marquee:hover .tech-marquee-inner{animation-play-state:paused}.tech-item{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md);min-width:80px}.tech-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;font-size:2rem;transition:transform var(--transition-fast)}.tech-item:hover .tech-icon{transform:scale(1.1)}.tech-name{font-size:var(--font-size-sm);color:var(--color-text-secondary);white-space:nowrap}.modal-overlay{position:fixed;inset:0;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;opacity:0;visibility:hidden;transition:all var(--transition-base)}.modal-overlay.open{opacity:1;visibility:visible}.modal-content{background:var(--color-bg-card);border-radius:var(--radius-xl);width:90%;max-width:600px;max-height:90vh;overflow-y:auto;transform:scale(.9) translateY(20px);transition:transform var(--transition-base)}.modal-overlay.open .modal-content{transform:scale(1) translateY(0)}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-lg);border-bottom:1px solid var(--color-border)}.modal-header h2{font-size:var(--font-size-xl);font-weight:600}.modal-close{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:none;border:none;border-radius:var(--radius-full);font-size:var(--font-size-xl);color:var(--color-text-secondary);transition:all var(--transition-fast)}.modal-close:hover{background:var(--color-bg);color:var(--color-text)}.modal-body{padding:var(--spacing-lg)}.calculator-form{display:grid;gap:var(--spacing-lg)}.form-group{display:flex;flex-direction:column;gap:var(--spacing-xs)}.form-group label{font-size:var(--font-size-sm);font-weight:500;color:var(--color-text-secondary)}.form-group input{padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-base);transition:border-color var(--transition-fast)}.form-group input:focus{outline:none;border-color:var(--color-accent)}.calculator-results{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-md);margin-top:var(--spacing-lg);padding:var(--spacing-lg);background:var(--color-bg);border-radius:var(--radius-lg)}.result-box{text-align:center;padding:var(--spacing-md)}.result-label{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--spacing-xs)}.result-value{font-size:var(--font-size-2xl);font-weight:700;color:var(--color-accent)}.api-notice{margin-top:var(--spacing-lg);padding:var(--spacing-md);background:linear-gradient(135deg,#fff7ed,#ffedd5);border-radius:var(--radius-md);border-left:4px solid #f97316}.api-notice p{font-size:var(--font-size-sm);color:#9a3412}@media(max-width:768px){.hero{grid-template-columns:1fr;text-align:center}.hero-sidebar{position:static}.hero-content{padding-top:0}.hero-bio{text-align:left}.education-cards{flex-direction:column}.calculator-results{grid-template-columns:1fr}}