*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f5f5;overflow:hidden}.app{display:grid;grid-template-columns:384px 1fr;height:100vh;overflow:hidden}.left-panel{background-color:#e8e8e8;padding:50px 30px;border-right:1px solid #d0d0d0;overflow-y:auto;height:100vh;display:flex;align-items:center;justify-content:center}.page-title h1{font-size:36px;font-weight:700;line-height:1.1;margin-bottom:40px;color:#1a1a1a;font-family:Georgia,Times New Roman,serif}.profile-card{padding:0;display:flex;flex-direction:column;align-items:center;text-align:center}.profile-image-container{display:flex;justify-content:center;margin-bottom:20px}.profile-image{width:115px;height:115px;border-radius:50%;object-fit:cover}.profile-name{font-size:24px;font-weight:600;text-align:center;margin-bottom:6px;color:#1a1a1a}.profile-tagline{font-size:15px;color:#666;text-align:center;margin-bottom:10px}.profile-location{display:flex;align-items:center;justify-content:center;gap:6px;color:#666;font-size:14px;margin-bottom:20px}.location-icon{color:#999}.social-links{display:flex;flex-direction:column;gap:12px;margin-bottom:24px;align-items:flex-start}.social-link{display:flex;align-items:center;gap:8px;color:#666;text-decoration:none;font-size:14px;transition:color .2s}.social-link:hover{color:#1a1a1a}.social-link svg{font-size:16px}.support-button{width:auto;min-width:180px;padding:14px 20px;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:opacity .2s;display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:12px}.support-button:hover{opacity:.9}.coffee-button{background-color:#ffe066;color:#1a1a1a}.patron-button{background-color:#f76c6c;color:#fff}.button-icon{font-size:16px;display:inline-flex;align-items:center}.right-panel{background-color:#f5f5f5;padding:60px 80px;height:100vh;overflow:hidden;position:relative}.activity-timeline{max-width:700px;display:flex;flex-direction:column;height:100%;margin:0 auto}.activity-header{font-size:36px;font-weight:700;margin-bottom:0;color:#1a1a1a;padding-top:0;padding-bottom:40px;margin-top:0;flex-shrink:0;font-family:Georgia,Times New Roman,serif;display:flex;gap:30px;align-items:center}.tab-button{background:none;border:none;font-size:36px;font-weight:700;font-family:Georgia,Times New Roman,serif;color:#999;cursor:pointer;padding:0;transition:color .3s}.tab-button:hover{color:#666}.tab-button.active{color:#1a1a1a}.timeline-container{position:relative;overflow-y:auto;overflow-x:hidden;padding-right:2rem;padding-left:1rem;padding-top:60px;padding-bottom:60px;flex:1;display:flex;align-items:flex-start}.timeline-items-wrapper{width:100%}.experiences-content{width:100%;padding:40px 20px}.timeline-container::-webkit-scrollbar{display:none}.timeline-container{-ms-overflow-style:none;scrollbar-width:none}.fade-effect{position:absolute;bottom:0;left:0;right:0;height:150px;background:linear-gradient(to bottom,transparent 0%,rgba(245,245,245,.3) 40%,rgba(245,245,245,.8) 70%,rgba(245,245,245,.95) 100%);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);pointer-events:none;z-index:5}.timeline-item{display:grid;grid-template-columns:40px 1fr;gap:15px;margin-bottom:45px}.timeline-line-container{position:relative;display:flex;flex-direction:column;align-items:center}.timeline-icon-wrapper{width:40px;height:40px;display:flex;align-items:center;justify-content:center;z-index:2;flex-shrink:0}.status-icon{font-size:24px;color:#666}.timeline-line{position:absolute;top:40px;left:50%;transform:translate(-50%);width:2px;height:100%;background-color:#e0e0e0;min-height:60px}.timeline-content{padding-top:0;padding-right:20px}.timeline-text{font-size:16px;line-height:1.8;color:#333;margin-bottom:8px;display:inline}.timeline-text strong{font-weight:600;color:#1a1a1a}.timeline-date{font-size:14px;color:#999;display:inline;margin-left:8px}.expand-arrow{color:#999;margin-left:4px}.timeline-details{margin-top:12px;padding:16px;background-color:#fff;border-radius:8px;font-size:14px;color:#666;box-shadow:0 1px 4px #00000014}.activity-type-badge{display:inline-block;padding:2px 8px;border-radius:4px;font-size:12px;font-weight:600;margin-right:6px;text-transform:uppercase}.badge-project{background-color:#e3f2fd;color:#1976d2}.badge-blog{background-color:#fce4ec;color:#c2185b}.badge-hackaton{background-color:#fff3e0;color:#f57c00}.badge-work{background-color:#e8f5e9;color:#388e3c}.badge-projectmvp{background-color:#f3e5f5;color:#7b1fa2}.activity-link{color:#1a1a1a;text-decoration:none;transition:color .2s}.activity-link:hover{color:#2196f3;text-decoration:underline}@media(max-width:1100px){.app{grid-template-columns:80px 1fr;grid-template-rows:none;height:100vh}.left-panel{padding:0;border-right:1px solid #d0d0d0;border-bottom:none;height:100vh;width:80px;display:flex;align-items:center;justify-content:center;overflow-y:hidden}.page-title{display:none}.profile-card{display:flex;align-items:center;justify-content:center;height:100%}.profile-image-container,.profile-tagline,.profile-location,.social-links,.support-button{display:none}.profile-name{writing-mode:vertical-rl;transform:rotate(180deg);font-size:18px;white-space:nowrap;text-align:center;margin:0}.right-panel{padding:30px 40px;height:100vh}.timeline-item{gap:15px;margin-bottom:28px}.activity-header{font-size:28px;gap:20px}.tab-button{font-size:28px}}@media(max-width:600px){.app{grid-template-columns:1fr;grid-template-rows:60px 1fr;height:100vh}.left-panel{width:100%;height:60px;border-right:none;border-bottom:1px solid #d0d0d0;padding:0 20px}.profile-card{height:100%;width:100%}.profile-name{writing-mode:horizontal-tb;transform:none;font-size:18px;display:flex;align-items:center;height:100%}.right-panel{height:calc(100vh - 60px);padding:20px}.activity-header{font-size:20px;margin-bottom:16px;padding-bottom:12px}.timeline-item{grid-template-columns:30px 1fr;gap:10px;margin-bottom:20px}.timeline-icon-wrapper{width:30px;height:30px}.status-icon{font-size:18px}.timeline-text{font-size:14px}.timeline-date{font-size:12px}.fade-effect{height:60px}.activity-header{font-size:24px;gap:15px}.tab-button{font-size:24px}}
