:root{--bg-color: #ffffff;--text-primary: #1a1a1a;--text-secondary: #4a4a4a;--card-bg: rgba(255, 255, 255, .4);--card-border: #e5e7eb;--accent-color: #4285F4;--font-main: "Roboto", sans-serif;--font-mono: "Roboto Mono", monospace;--font-space: "Space Mono", monospace;--toggle-bg: rgba(0, 0, 0, .05);--toggle-border: rgba(0, 0, 0, .1);--bubble-bg: #1a1a1a;--bubble-text: #ffffff;--shadow-color: rgba(0, 0, 0, .05);--badge-border: rgba(0, 0, 0, .1)}[data-theme=dark]{--bg-color: #0a0a0a;--text-primary: #ffffff;--text-secondary: #ffffff;--card-bg: rgba(20, 20, 20, .4);--card-border: #333333;--accent-color: #60a5fa;--toggle-bg: rgba(255, 255, 255, .1);--toggle-border: rgba(255, 255, 255, .2);--bubble-bg: #ffffff;--bubble-text: #000000;--shadow-color: rgba(255, 255, 255, .1);--badge-border: rgba(255, 255, 255, .5)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-main);background-color:var(--bg-color);color:var(--text-primary);line-height:1.6;overflow-x:hidden;min-height:100vh;transition:background-color .5s cubic-bezier(.4,0,.2,1),color .5s cubic-bezier(.4,0,.2,1)}main{width:100%;min-height:100vh;position:relative}.bento-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;max-width:1200px;margin:0 auto;padding:2rem;min-height:100vh;align-content:center}.grid-item{display:flex;flex-direction:column}.hero-span{grid-column:span 3;text-align:center}.span-2{grid-column:span 2}.span-1{grid-column:span 1}.footer-span{grid-column:span 3;display:flex;flex-direction:column;align-items:center}h1{font-size:3.5rem;font-weight:800;letter-spacing:-.03em;margin-bottom:.5rem;color:var(--text-primary)}.bio{font-size:1.1rem;color:var(--text-secondary);max-width:700px;margin:0 auto 1rem;font-weight:400;line-height:1.6}.card{background:var(--card-bg);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-radius:24px;padding:1.5rem;width:100%;height:100%;border:1px solid var(--card-border);box-shadow:0 8px 32px #0000000d;display:flex;flex-direction:column;align-items:flex-start;transition:transform .3s ease,box-shadow .3s ease,background-color .5s ease,border-color .5s ease}.card:hover{transform:translateY(-2px);box-shadow:0 12px 40px #00000014;background:rgba(255,255,255,.5)}.card h3{font-family:var(--font-mono);font-size:.9rem;text-transform:uppercase;letter-spacing:.05em;margin-bottom:1rem;color:var(--text-primary);font-weight:600;opacity:.9}.badges{display:flex;flex-wrap:nowrap;gap:0;padding:.5rem 0;width:100%}.badge-container{position:relative;margin-left:-15px;transition:margin-left .5s cubic-bezier(.34,1.56,.64,1);z-index:1}.badge-container:first-child{margin-left:0}.badge{width:40px;height:40px;border-radius:12px;object-fit:contain;padding:8px;border:1px solid var(--badge-border);transition:all .5s cubic-bezier(.34,1.56,.64,1);box-shadow:0 2px 5px var(--shadow-color);background:white;cursor:pointer;display:block}.badges:hover .badge-container{margin-left:8px;z-index:10}.badge-container:hover{z-index:20}.badge-container:hover .badge{transform:scale(1.2) translateY(-4px);box-shadow:0 8px 12px #0000001a;border-color:#d1d5db}.tooltip{position:absolute;bottom:100%;left:50%;transform:translate(-50%) translateY(10px);background-color:#1a1a1ae6;color:#fff;padding:6px 10px;border-radius:6px;font-family:var(--font-mono);font-size:.75rem;white-space:nowrap;opacity:0;visibility:hidden;transition:all .3s cubic-bezier(.34,1.56,.64,1);pointer-events:none;margin-bottom:8px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);box-shadow:0 4px 6px #0000001a}.tooltip:after{content:"";position:absolute;top:100%;left:50%;margin-left:-4px;border-width:4px;border-style:solid;border-color:rgba(26,26,26,.9) transparent transparent transparent}.badge-container:hover .tooltip{opacity:1;visibility:visible;transform:translate(-50%) translateY(0)}.social-links{display:flex;justify-content:center;gap:1rem;margin-top:1.5rem}.social-links .badge{height:40px;filter:grayscale(100%);opacity:.6;transition:all .3s ease}.social-links .badge:hover{filter:grayscale(0%);opacity:1;transform:translateY(-2px)}footer{text-align:center;padding:3rem;color:#888;font-size:.875rem;margin-top:auto;font-family:var(--font-mono)}@media (max-width: 768px){h1{font-size:3rem}.bio{font-size:1.125rem}main{padding:3rem 1.5rem}.badges{flex-wrap:wrap;justify-content:center}section{flex-direction:column!important;align-items:center!important;gap:.5rem!important}section h3{width:100%!important;min-width:100%!important;text-align:center!important}}.cursor{display:inline-block;width:2px;background-color:var(--bubble-text);animation:blink 1s step-end infinite;margin-left:2px;vertical-align:middle;height:1em}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.speech-bubble-container{position:absolute;top:-60px;left:140px;z-index:10;pointer-events:none}.speech-bubble{background-color:var(--bubble-bg);color:var(--bubble-text);padding:10px 18px;border-radius:16px;font-weight:500;font-size:.85rem;white-space:nowrap;box-shadow:0 4px 20px var(--shadow-color);font-family:var(--font-mono);position:relative;pointer-events:auto;transition:background-color .5s ease,color .5s ease,box-shadow .5s ease}.speech-bubble:after{content:"";position:absolute;bottom:-8px;left:20px;width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid var(--bubble-bg);transition:border-top-color .5s ease}@media (max-width: 768px){.speech-bubble-container{left:50%;transform:translate(-50%);top:-70px;width:auto;display:flex;justify-content:center}.speech-bubble:after{left:50%;transform:translate(-50%)}}
