:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.6;font-weight:400;color-scheme:light;color:#213547;background:linear-gradient(to bottom,#e8f4f8,#fff);min-height:100vh}body{margin:0;display:flex;min-width:320px;min-height:100vh}a{color:#0a66c2;text-decoration:none}a:hover{text-decoration:underline}@media (max-width: 768px){body{padding:1rem}}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}.profile-container{max-width:1200px;margin:0 auto;padding:2rem;width:100%}.profile-header{background:#fff;border-radius:12px;padding:3rem;margin-bottom:2rem;box-shadow:0 2px 8px #00000014;text-align:center}.profile-header h1{font-size:2.5rem;font-weight:700;color:#1a4d7a;margin-top:1rem}.profile-photo{width:150px;height:150px;border-radius:50%;object-fit:cover;margin-bottom:1rem}.about-section{background:#fff;border-radius:12px;padding:2.5rem;margin-bottom:2rem;box-shadow:0 2px 8px #00000014}.about-section p{font-size:1.1rem;line-height:1.8;color:#333}.links-section{background:#fff;border-radius:12px;padding:2.5rem;margin-bottom:2rem;box-shadow:0 2px 8px #00000014}.links-section h2{font-size:2.2rem;font-weight:700;color:#1a4d7a;margin-bottom:2rem;text-align:center}.links-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}.link-card{padding:1.5rem;border:1px solid #d0e8f0;border-radius:8px;background:#f8fcff;transition:transform .2s,box-shadow .2s;text-align:left}.link-card:hover{transform:translateY(-4px);box-shadow:0 4px 12px #1a4d7a26}.link-card h3{font-size:1.4rem;font-weight:600;color:#1a4d7a;margin-bottom:.75rem}.link-card p{font-size:1rem;line-height:1.6;color:#555}.project-item{display:flex;gap:2rem;margin-bottom:2.5rem;background:#fff;border-radius:12px;padding:2rem;box-shadow:0 2px 8px #00000014;align-items:flex-start}.project-image{flex:0 0 40%;width:40%;border-radius:8px;overflow:hidden;box-shadow:0 2px 6px #0000001a}.project-image img{width:100%;height:auto;display:block;object-fit:cover}.project-content{flex:1;padding-left:0}.project-content h3{font-size:1.6rem;font-weight:600;color:#1a4d7a;margin-bottom:1rem;margin-top:0}.project-content p{font-size:1.05rem;line-height:1.7;color:#333;margin-bottom:.5rem}.project-content a{color:#06c;text-decoration:none;font-weight:500}.project-content a:hover{text-decoration:underline}@media (max-width: 768px){.profile-container{padding:1rem}.profile-photo{width:100px;height:100px}.profile-header h1,.links-section h2,.narrative-section h2{font-size:1.8rem}.project-item{flex-direction:column;gap:1.5rem;padding:1.5rem}.project-image{flex:1;width:100%}.project-content{padding-left:0}.project-content h3{font-size:1.4rem}.about-section p{font-size:1rem}.link-card h3{font-size:1.2rem}}.narrative-section{padding:2.5rem;margin:2rem 0;background:#fff;border-radius:12px;box-shadow:0 2px 8px #00000014}.narrative-section h2{text-align:center;margin-bottom:2rem;color:#1a4d7a;font-size:2.2rem;font-weight:700}.narrative-section h3{color:#1a4d7a;margin:2rem 0 1rem;font-size:1.9rem;font-weight:600}.narrative-section .overview{background:#f8f9fa;border-radius:12px;padding:2rem;margin-bottom:2rem;box-shadow:0 2px 4px #0000000d}.narrative-section .experience>div{margin-bottom:2rem}.narrative-section p{background:#fff;padding:1.5rem;margin:1rem 0;border-radius:8px;box-shadow:0 2px 8px #0000000d;line-height:1.6;border-left:4px solid #0066cc;transition:transform .2s ease,box-shadow .2s ease;text-align:justify;-webkit-hyphens:auto;hyphens:auto}.narrative-section p:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.narrative-link{color:#06c;text-decoration:none;font-weight:500;transition:color .2s ease}.narrative-link:hover{color:#036;text-decoration:underline}@media (max-width: 768px){.narrative-section,.narrative-section .overview,.narrative-section p{padding:1rem}}.narrative-section .overview p{border-left-color:#34495e}.narrative-section .experience div:nth-child(1) p{border-left-color:#ff8c00}.narrative-section .experience div:nth-child(2) p{border-left-color:#2ecc71}.narrative-section .experience div:nth-child(3) p{border-left-color:#e74c3c}