:root{--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--space-5: 5px;--space-6: 6px;--space-10: 10px;--space-12: 12px;--space-15: 15px;--space-20: 20px;--space-25: 25px;--space-30: 30px;--row-height: 80px;--space-skill-y: .25rem;--space-skill-x: .75rem;--sidebar-width: 150px;--content-max-width: 1100px;--radius-sm: 5px;--radius-md: 6px;--radius-lg: 8px;--radius-xl: 10px;--radius-xxl: 12px;--radius-pill: 9999px;--border-thin: 1px;--border-thick: 2px;--shadow-sm: 0 2px 6px rgba(0, 0, 0, .08);--shadow-md: 0 4px 12px rgba(0, 0, 0, .1);--shadow-lg: 0 6px 10px rgba(0, 0, 0, .1);--font-size-sm: 14px;--font-size-base: 16px;--font-size-md: 1.1rem;--font-size-lg: 1.2rem;--font-size-h1: 2rem;--font-size-h1-mobile: 2.5rem;--transition-fast: .15s ease;--transition-base: .2s ease;--transition-slow: .3s ease;--transition-slow-inout: .3s ease-in-out}*{margin:0;padding:0;box-sizing:border-box;text-transform:lowercase}html,body{height:100%;margin:0;overflow-x:hidden}#root{display:flex;flex-direction:column;height:100%;width:100%}body{font-family:Merriweather,sans-serif;background-color:var(--page-bg);color:var(--text-heading);line-height:1.6;min-height:100vh;padding:var(--space-20);display:flex;flex-direction:column;align-items:center;overflow-x:hidden}:root{--color-1: #f4b6b6;--color-2: #f7cfa4;--color-3: #f9e6a6;--color-4: #bde3ae;--color-5: #a2baff;--color-6: #d09fdd;--white: #ffffff;--page-bg: #faf7fb;--surface: #ffffff;--border-light: #e5e0e8;--gray-hover: #e0e0e0;--gray-hover-border: #bbbbbb;--gray-mid: #aaaaaa;--gray-dark: #666666;--text: #222222;--text-heading: #333333;--text-muted: #777777;--link-hover: var(--gray-mid);--button-hover: #87a4fa;--button-on-hover: #a7e090;--highlight-bg: #d8eafd;--highlight-border: #60a5fa;--highlight-text: #1e3a8a}.sidebar{width:var(--sidebar-width);display:flex;flex-direction:column;padding:calc(var(--space-20) - var(--space-10)) var(--space-20) var(--space-20);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);background:var(--white);position:relative;overflow:hidden}.sidebar-nav{display:flex;flex-direction:column;gap:var(--space-sm)}.sidebar-link{position:relative;padding:var(--space-10) var(--space-12);border-radius:var(--radius-md);text-decoration:none;color:var(--text);overflow:hidden;transition:transform var(--transition-fast);isolation:isolate}.sidebar-link:before{content:"";position:absolute;inset:0;opacity:0;transition:opacity var(--transition-base);z-index:0}.sidebar-link{z-index:1}.sidebar-link:hover:before{opacity:.25}.sidebar-link:nth-child(1):before{background:var(--color-1)}.sidebar-link:nth-child(2):before{background:var(--color-2)}.sidebar-link:nth-child(3):before{background:var(--color-3)}.sidebar-link:nth-child(4):before{background:var(--color-4)}.sidebar-link:nth-child(5):before{background:var(--color-5)}.sidebar-link:nth-child(6):before{background:var(--color-6)}.sidebar-link:nth-child(7):before{background:var(--color-7)}.sidebar-link:nth-child(8):before{background:var(--color-8)}.sidebar-link:nth-child(9):before{background:var(--color-9)}.sidebar-link:nth-child(10):before{background:var(--color-10)}.sidebar-link:nth-child(11):before{background:var(--color-11)}.sidebar-link:nth-child(12):before{background:var(--color-12)}.link-logo{width:var(--space-lg);height:var(--space-lg);object-fit:contain}.link-badge{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-6);padding:var(--space-6) var(--space-12);margin:var(--space-6);background-color:var(--border-light);color:var(--text-heading);font-size:var(--font-size-sm);text-decoration:none;border-radius:var(--radius-md);border:var(--border-thick) solid var(--gray-dark)}.link-badge:hover{background-color:var(--gray-hover);border:var(--border-thick) solid var(--gray-hover-border);transform:translateY(1px)}.section{border-radius:var(--radius-md);background:var(--white);font-size:var(--font-size-sm)}.section-label{font-size:var(--font-size-base);text-align:center;background-color:var(--gray-dark);color:var(--white);border-radius:var(--radius-md)}.section-content{padding-left:0;margin:var(--space-20)}.section-content ul{list-style-type:none}.skills-list{display:flex;flex-wrap:wrap;gap:var(--space-sm)}.skill-entry{background-color:var(--border-light);border-radius:var(--radius-pill);padding:var(--space-skill-y) var(--space-skill-x);border:var(--border-thin) solid var(--border-light);transition:all var(--transition-base)}.skill-entry.highlight{background-color:var(--highlight-bg);border-color:var(--highlight-border);color:var(--highlight-text)}.dated-entry{padding:var(--space-5) 0}.company-group{border:var(--border-thin) solid var(--border-light);border-radius:var(--radius-xxl);padding:var(--space-md) var(--space-20);margin-bottom:var(--space-20);background:var(--surface);transition:box-shadow var(--transition-base)}.company-group:hover{box-shadow:var(--shadow-sm)}.company-name{margin-top:0;margin-bottom:var(--space-12);font-size:var(--font-size-md);font-weight:600;color:var(--text-heading)}.resume-grid{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:var(--row-height);gap:var(--space-12);padding:var(--space-lg);background-color:var(--surface);font-size:var(--font-size-base)}.projects{grid-column:1 / span 4;grid-row:1 / span 4}.education{grid-column:1 / span 4;grid-row:4 / span 4}.experience{grid-column:5 / span 5;grid-row:1 / span 6}.skills{grid-column:10 / span 3;grid-row:1 / span 6}header{background:linear-gradient(135deg,var(--color-1),var(--color-2),var(--color-3),var(--color-4),var(--color-5),var(--color-6));color:var(--white);padding:var(--space-10) 0;text-align:center;border-radius:var(--radius-lg);border:solid var(--gray-dark);border-width:0 0 var(--border-thick) 0;max-width:var(--content-max-width);margin:0 auto;width:100%}nav ul{list-style-type:none;display:flex;justify-content:center;gap:var(--space-30);padding:0;margin:0}nav ul li{display:inline-block}nav ul li a{font-size:var(--font-size-lg);font-weight:500;color:var(--text);text-decoration:none;text-shadow:var(--white) -1px -1px;transition:color var(--transition-slow)}nav ul li a:hover{color:var(--gray-mid)}h1{font-size:var(--font-size-h1);font-weight:600;color:var(--text);text-shadow:var(--white) -1px -1px;letter-spacing:1px;transition:color var(--transition-slow);text-align:center}h2{font-size:var(--font-size-lg)}button{background:var(--color-5);color:var(--white);padding:var(--space-12) var(--space-25);border:none;border-radius:var(--radius-sm);font-size:var(--font-size-md);cursor:pointer;transition:background-color var(--transition-slow)}button:hover{background-color:var(--button-hover)}.button.on{background:var(--color-4)}.button.on:hover{background-color:var(--button-on-hover)}.card{background:var(--white);padding:var(--space-25);border-radius:var(--radius-xxl);box-shadow:var(--shadow-md);margin-top:var(--space-20);transition:transform var(--transition-slow-inout)}.card:hover{transform:translateY(-5px)}@media(max-width:768px){body{padding:var(--space-10)}nav ul{flex-direction:column;gap:var(--space-15)}.App{padding:var(--space-25) var(--space-15)}h1{font-size:var(--font-size-h1-mobile)}p{font-size:var(--font-size-base)}button{padding:var(--space-10) var(--space-20)}}.app-layout{display:flex;gap:var(--space-15);margin-top:var(--space-15);min-height:85vh;max-width:var(--content-max-width);margin-left:auto;margin-right:auto;width:100%}.app-main{flex:1;padding:var(--space-20);background-color:var(--surface);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);overflow-x:hidden}
