:root{--purple-dark: #4a0080;--purple-primary: #6A0DAD;--purple-light: #8A2BE2;--purple-lighter: #B57FFB;--purple-lightest: #E5CCFF;--navy-text: #1B1F3B;--gray-medium: #6B7280;--gray-light: #9CA3AF;--white: #FFFFFF;--gray-50: #F8F9FA;--gray-100: #F3F4F6;--gray-200: #E5E7EB;--gray-300: #D1D5DB;--header-height: 72px;--section-padding: 32px 0;--section-min-height: 500px}*{margin:0;padding:0;box-sizing:border-box;font-family:Spoqa Han Sans Neo,"sans-serif";word-break:keep-all}html,body,#root{width:100%;height:100vh;overflow-x:hidden}main{padding-top:var(--header-height);max-width:1200px;margin:0 auto;padding-left:32px;padding-right:32px;width:100%}main>section{height:fit-content;min-height:var(--section-min-height);padding:var(--section-padding);scroll-margin-top:var(--header-height);display:flex;flex-direction:column;align-items:center;margin-bottom:32px}footer{background-color:var(--white);display:flex;justify-content:center;align-items:flex-end;padding:32px 0;color:var(--gray-medium);border-top:1px solid var(--gray-200)}li{list-style:none}.section__title{font-size:32px;font-weight:700;position:relative;padding-bottom:8px;margin-bottom:1rem}.section__title:after{content:"";position:absolute;bottom:0;left:50%;width:120%;height:4px;transform:translate(-50%);background:linear-gradient(to right,var(--purple-dark),var(--purple-lighter));border-radius:2px}.cards-container{display:flex;flex-wrap:wrap;gap:30px;justify-content:center}.card__section{width:100%;max-width:1100px;margin:40px auto 0}.card__section-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:32px}.contact{padding:80px 0;background:#f8f9fa}.contact__container{max-width:1200px;margin:0 auto;padding:0 32px;text-align:center}.contact__title{font-size:32px;font-weight:700;position:relative;padding-bottom:8px;margin-bottom:1rem;color:#333}.contact__description{font-size:16px;color:#666;margin-bottom:48px;line-height:1.6}.contact__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:24px;max-width:800px;margin:40px auto 0}.contact__item{display:flex;flex-direction:column;align-items:center;padding:32px 24px;background:#fff;border-radius:16px;text-decoration:none;color:#333;box-shadow:0 2px 12px #0000000f;border:1.5px solid #f3f4f6;transition:all .3s ease}.contact__item:hover{transform:translateY(-8px);box-shadow:0 8px 32px #6366f129;border-color:var(--purple-primary);color:var(--purple-primary)}.contact__icon{margin-bottom:16px;padding:16px;background:#f3f4f6;border-radius:12px;transition:all .3s ease}.contact__item:hover .contact__icon{background:var(--purple-primary);color:#fff}.contact__label{font-size:18px;font-weight:600}@media (max-width: 768px){.contact{padding:60px 0}.contact__container{padding:0 16px}.contact__grid{grid-template-columns:1fr 1fr;gap:16px}.contact__item{padding:24px 16px}.contact__title{font-size:28px}}.rainbow-gradient{background:linear-gradient(45deg,red,#ff8000,#ff0,#0f0,#0ff,#0080ff,#8000ff);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-size:300% 300%;animation:rainbow-shift 3s ease-in-out infinite;font-size:32px}@keyframes rainbow-shift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.about__content-wrapper{width:100%;position:relative;overflow:hidden}.about__info-wrapper{display:flex;flex-direction:column}.about__info-name{font-size:36px;font-weight:700}.about__info-role{font-size:16px;font-weight:700;margin-top:4px;margin-left:4px}.about__info-introduce{font-size:24px}@media (max-width: 768px){.image-wrapper__profile{width:128px;height:128px}}.about__background{z-index:-1;width:100%;height:100%;pointer-events:none;background-color:#fff}.typing-text{margin-bottom:1.5rem;opacity:0;position:relative}.typing-text.active{opacity:1}.typing-text.completed{opacity:.9}.cursor{display:inline-block;width:2px;height:1.2em;background-color:#64ffda;margin-left:2px;animation:blink 1s infinite;vertical-align:text-bottom}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:0}}.cursor.hide{display:none}.header{position:fixed;top:0;left:0;width:100%;background:#fff9;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);z-index:100;border-bottom:1px solid var(--gray-200);overflow:hidden}.header__nav{display:flex;align-items:center;justify-content:space-between;max-width:1200px;margin:0 auto;height:var(--header-height);padding:0 32px;width:100%;box-sizing:border-box}.header__logo{height:44px;width:auto;cursor:pointer}.header__menu-toggle{display:none;cursor:pointer}.header__nav-menu{display:flex;gap:36px;list-style:none;margin:0;padding:0}.header__nav-button{background:none;border:none;color:var(--navy-text);cursor:pointer;font-size:inherit;font-family:inherit;padding:0;transition:color .2s ease}.header__nav-button:hover{color:var(--purple-primary)}.header__mobile-menu{background:#fff;border-top:1px solid #eee;padding:8px 0;position:absolute;width:100%;top:var(--header-height);left:0;z-index:99;list-style:none;margin:0}.header__mobile-button{display:block;padding:12px 16px;width:100%;text-align:left;background:none;border:none;color:var(--navy-text);cursor:pointer;font-size:inherit;font-family:inherit;transition:background-color .2s ease}.header__mobile-button:hover{background-color:var(--gray-100, #f5f5f5)}@media (max-width: 768px){.header__nav-menu{display:none}}.typing-effect-container{display:flex;align-items:center;justify-content:center;padding:2rem;font-family:Inter,Arial,sans-serif}.typing-effect-wrapper{max-width:64rem;width:100%}.typing-effect-card{background:#000000e6;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:1rem;padding:2rem;vertical-align:middle}.typing-effect-content{min-height:265px}.typing-effect-text-container{font-size:1.125rem;line-height:1.75;display:flex;flex-direction:column;gap:1.5rem}.typing-effect-completed-text{color:#e5e7eb;opacity:.9;margin:0}.typing-effect-current-text{color:#fff;margin:0;position:relative}.typing-effect-cursor{display:inline-block;width:2px;height:1.5rem;background:#60a5fa;margin-left:4px;transition:opacity .1s ease;vertical-align:text-bottom}.typing-effect-cursor.visible{opacity:1}.typing-effect-cursor.hidden{opacity:0}.typing-effect-progress{margin-top:2rem;display:flex;align-items:center;justify-content:center;gap:.5rem}.typing-effect-progress-dot{width:.75rem;height:.75rem;border-radius:50%;transition:all .3s ease}.typing-effect-progress-dot.pending{background:#4b5563}.typing-effect-progress-dot.active{background:#60a5fa;animation:pulse 1s infinite}.typing-effect-progress-dot.completed{background:#10b981}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.typing-effect-status{margin-top:1.5rem;text-align:center;font-size:.875rem;color:#9ca3af}.typing-effect-info-panel{margin-top:1.5rem;background:#ffffff0d;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:.75rem;padding:1rem;border:1px solid rgba(255,255,255,.1)}.typing-effect-info-title{color:#fff;font-size:.875rem;font-weight:600;margin-bottom:.75rem}.typing-effect-info-grid{display:grid;grid-template-columns:1fr;gap:1rem;font-size:.875rem;color:#d1d5db}@media (min-width: 768px){.typing-effect-info-grid{grid-template-columns:1fr 1fr}}.typing-effect-info-item{color:#d1d5db}.typing-effect-info-label{font-weight:600}@media (max-width: 768px){.typing-effect-container{padding:1rem}.typing-effect-card{padding:1.5rem}.typing-effect-title{font-size:1.5rem}.typing-effect-text-container{font-size:1rem}.typing-effect-content{min-height:250px}}@media (prefers-reduced-motion: reduce){.typing-effect-progress-dot.active{animation:none}.typing-effect-cursor{transition:none}}@media (prefers-color-scheme: dark){.typing-effect-container{background:linear-gradient(135deg,#0c0a09,#44403c,#0c0a09)}}.card-container{width:100%;max-width:480px;height:280px;perspective:1000px}.card-flipper{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.4,0,.2,1)}.card-container:hover .card-flipper{transform:rotateY(180deg)}.card-front,.card-back{position:absolute;width:100%;height:100%;backface-visibility:hidden;display:flex;flex-direction:column;gap:16px;background:#fff;border-radius:12px;padding:24px;box-shadow:0 4px 20px #00000014;border:1px solid #e5e7eb;box-sizing:border-box}.card-front{z-index:2}.card-back{transform:rotateY(180deg);background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:1px solid #667eea}.card-back .card-info-title{color:#fff;border-bottom:2px solid rgba(255,255,255,.3);padding-bottom:8px}.card-info-title{font-weight:700;font-size:20px;color:#333;margin:0;line-height:1.3}@keyframes gentleBounce{0%,80%,to{transform:translateY(1px);opacity:.8}40%{transform:translateY(-1px);opacity:1}}.card-info-scroll{position:absolute;top:24px;right:24px;animation:gentleBounce 2s ease-in-out 2s infinite}.card-info-company{color:#444;font-size:15px;margin:0;font-weight:500}.card-info-period{color:#888;font-size:14px;margin:0}.card-info-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto}.card-info-tag{display:inline-block;background:#f3f4f6;color:#374151;padding:6px 12px;border-radius:20px;font-size:12px;font-weight:500;border:1px solid #e5e7eb;transition:all .2s ease}.card-info-tag:hover{background:var(--purple-lighter, #8b5cf6);color:#fff;border-color:var(--purple-lighter, #8b5cf6);transform:translateY(-1px)}.card-flip-indicator{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:auto;padding:8px;background:#8b5cf61a;border-radius:8px;color:var(--purple-lighter, #8b5cf6);font-size:13px;font-weight:500;opacity:.7;transition:opacity .3s ease}.card-container:hover .card-flip-indicator{opacity:1}.card-info-experiences{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px;overflow-y:auto;flex:1}.card-info-experience-item{background:#fff3;color:#fff;border-radius:6px;padding:8px 12px;font-size:13px;font-weight:500;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.3);transition:all .2s ease}.card-info-experience-item:hover{background:#ffffff4d;transform:translate(4px)}.card-descriptions{display:flex;flex-direction:column;gap:8px;overflow-y:auto;flex:1}.card-descriptions::-webkit-scrollbar{display:none}.card-descriptions{scrollbar-width:none}.card-descriptions{-ms-overflow-style:none}.card-description{margin:0;color:#fff;font-size:14px;line-height:1.5;padding:8px 12px;background:#ffffff1a;border-radius:6px}@media (max-width: 768px){.card-container{height:250px;max-width:100%}.card-front,.card-back{padding:20px;gap:12px}.card-info-title{font-size:18px}.card-info-tags{gap:6px}.card-info-tag{padding:4px 8px;font-size:11px}}.card-container:focus-within .card-flipper{transform:rotateY(180deg)}.card-flipper,.card-front,.card-back{will-change:transform}@media (hover: none){.card-container:active .card-flipper{transform:rotateY(180deg)}}.card-info-lecture{display:flex;flex-direction:column;gap:16px;background:#fff;border-radius:12px;padding:24px;box-shadow:0 4px 20px #00000014;border:1px solid #e5e7eb;transition:all .3s ease;max-width:480px}.card-info-lecture:hover{transform:scale(1.04);box-shadow:0 8px 30px #0000001f;border-color:var(--purple-lighter)}.card-info-lecture-title{font-weight:700;font-size:20px;color:#333;margin:0}.card-info-lecture-company{color:#444;font-size:15px;margin:0}.card-info-lecture-period{color:#888;font-size:14px;margin:0}.card-info-lecture-tags{display:flex;flex-wrap:wrap;gap:8px}.card-info-lecture-tag{display:inline-block;background:#f3f4f6;color:#374151;padding:4px 12px;border-radius:20px;font-size:12px;font-weight:500;border:1px solid #e5e7eb;transition:all .2s ease}.card-info-lecture-tag:hover{background:var(--purple-lighter);color:#fff;border-color:var(--purple-lighter)}.card-info-lecture-experiences{display:flex;flex-wrap:wrap;gap:8px}.card-info-lecture-experience-item{background:#f3f4f6;color:#000;border-radius:8px;padding:2px 10px;font-size:13px;font-weight:500;width:fit-content;text-align:center;transition:all .2s ease}.card-info-lecture-experience-item:hover{background:var(--purple-lighter);color:#fff}.card__description{margin-left:4px;color:var(--gray-medium);font-size:14px;overflow-wrap:break-word}.timeline-container{position:relative;max-width:1200px;margin:0 auto;padding:40px 20px}.timeline-line{position:absolute;left:50%;top:50%;height:calc(100% - 495px);bottom:0;width:2px;background:linear-gradient(to bottom,var(--purple-light),var(--purple-lightest));transform:translate(-50%,-50%);z-index:1}.timeline-item{position:relative;margin-bottom:60px;display:flex;align-items:center;width:100%;z-index:2}.timeline-item-left{justify-content:flex-end;transform:translate(-50%)}.timeline-item-left .timeline-content{margin-right:60px;text-align:left}.timeline-item-left .timeline-card{margin-left:auto}.timeline-item-right{justify-content:flex-start;transform:translate(50%)}.timeline-item-right .timeline-content{margin-left:60px;text-align:left}.timeline-item-right .timeline-card{margin-right:auto}.timeline-content{flex:1;width:fit-content}.timeline-dot{position:absolute;width:16px;height:16px;background:#fff;border-radius:50%;box-shadow:0 2px 8px #0000001a}.timeline-item-right .timeline-dot{left:0;transform:translate(-50%,50%)}.dot1.career{border:4px solid rgb(138,43,226)}.dot2.career{border:4px solid rgb(171,126,241)}.dot3.career{border:4px solid rgb(229,204,255)}.dot1.project{border:4px solid rgb(138,43,226)}.dot2.project{border:4px solid rgba(148,66,230,1)}.dot3.project{border:4px solid rgba(157,89,234,1)}.dot4.project{border:4px solid rgba(167,112,237,1)}.dot5.project{border:4px solid rgba(176,134,241,1)}.dot6.project{border:4px solid rgba(186,157,245,1)}.dot7.project{border:4px solid rgba(196,180,248,1)}.dot8.project{border:4px solid rgba(229,204,255,1)}.timeline-item-left .timeline-dot{right:0;transform:translate(50%,50%)}.timeline-date{font-size:14px;font-weight:600;color:var(--purple-light);margin-bottom:8px;letter-spacing:.5px}.timeline-card{background:#fff;border-radius:12px;padding:24px;box-shadow:0 4px 20px #00000014;border:1px solid #e5e7eb;transition:all .3s ease;max-width:480px}.timeline-card:hover{transform:translateY(-4px);box-shadow:0 8px 30px #0000001f;border-color:var(--purple-lighter)}.timeline-title{font-size:20px;font-weight:700;color:#1f2937;margin:0 0 8px;line-height:1.3}.timeline-subtitle{font-size:16px;font-weight:600;color:#4b5563;margin:0 0 16px;line-height:1.4}.timeline-description{font-size:14px;color:#6b7280;margin:0 0 16px;line-height:1.6}.timeline-details{margin:0 0 20px;padding:0}.timeline-details li{font-size:13px;color:#374151;margin-bottom:6px;line-height:1.5;list-style:none;position:relative;padding-left:16px}.timeline-details li:before{content:"•";color:var(--purple-light);font-weight:700;position:absolute;left:0}.timeline-tags{display:flex;flex-wrap:wrap;gap:6px}.timeline-tag{display:inline-block;background:#f3f4f6;color:#374151;padding:4px 12px;border-radius:20px;font-size:12px;font-weight:500;border:1px solid #e5e7eb;transition:all .2s ease}.timeline-tag:hover{background:var(--purple-lighter);color:#fff;border-color:var(--purple-lighter)}@media (max-width: 768px){.timeline-container{padding:20px 16px}.timeline-line{left:30px}.timeline-item{justify-content:flex-start!important;margin-bottom:40px}.timeline-item-left,.timeline-item-right{justify-content:flex-start}.timeline-item-left .timeline-content,.timeline-item-right .timeline-content{margin-left:70px;margin-right:0;text-align:left;max-width:calc(100% - 70px)}.timeline-item-left .timeline-card,.timeline-item-right .timeline-card{margin-left:0;margin-right:0;max-width:100%}.timeline-dot{left:30px;width:12px;height:12px;border-width:3px}.timeline-card{padding:20px}.timeline-title{font-size:18px}.timeline-subtitle{font-size:15px}}@media (max-width: 480px){.timeline-container{padding:16px 12px}.timeline-card{padding:16px}.timeline-title{font-size:16px}.timeline-subtitle{font-size:14px}.timeline-description{font-size:13px}.timeline-details li{font-size:12px}}