 @property --dynamic-primary {syntax: '<color>';inherits: true;initial-value: #667eea;}@property --dynamic-secondary {syntax: '<color>';inherits: true;initial-value: #764ba2;}@property --dynamic-accent {syntax: '<color>';inherits: true;initial-value: #198754;}@font-face {font-family: 'fa-customized-pack';src: url('../assets/icons/fa-customized-pack.eot?i72ga7');src: url('../assets/icons/fa-customized-pack.eot?i72ga7#iefix') format('embedded-opentype'), url('../assets/icons/fa-customized-pack.ttf?i72ga7') format('truetype'), url('../assets/icons/fa-customized-pack.woff?i72ga7') format('woff'), url('../assets/icons/fa-customized-pack.svg?i72ga7#fa-customized-pack') format('svg');font-weight: normal;font-style: normal;font-display: block;}[class^="fa-"], [class*=" fa-"] {font-family: 'fa-customized-pack' !important;font-style: normal;font-weight: normal;font-variant: normal;text-transform: none;line-height: 1;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}.fas, .fab {display: inline-block;font-style: normal;font-variant: normal;text-rendering: auto;-webkit-font-smoothing: antialiased;}.fa-folder-open:before {content: "\e900";}.fa-blog:before {content: "\e901";}.fa-brain:before {content: "\e902";}.fa-camera:before {content: "\e903";}.fa-chart-line:before {content: "\e904";}.fa-check:before {content: "\e905";}.fa-chevron-down:before {content: "\e906";}.fa-chevron-up:before {content: "\e907";}.fa-code:before {content: "\e908";}.fa-cog:before {content: "\e909";}.fa-copy:before {content: "\e90a";}.fa-envelope:before {content: "\e90b";}.fa-github:before {content: "\e90c";}.fa-image:before {content: "\e90d";}.fa-language:before {content: "\e90e";}.fa-lock:before {content: "\e90f";}.fa-moon:before {content: "\e910";}.fa-music:before {content: "\e911";}.fa-palette:before {content: "\e912";}.fa-pause:before {content: "\e913";}.fa-pen:before {content: "\e914";}.fa-play:before {content: "\e915";}.fa-puzzle-piece:before {content: "\e916";}.fa-robot:before {content: "\e917";}.fa-sun:before {content: "\e918";}.fa-university:before {content: "\e919";}.fa-user:before {content: "\e91a";}.fa-2x {font-size: 2em !important;}.fa-3x {font-size: 3em !important;}html, body {overflow: auto;scrollbar-width: none;}html::-webkit-scrollbar, body::-webkit-scrollbar {display: none;}:root {--primary-color: #667eea;--primary-light: #764ba2;--primary-color-rgb: 0, 90, 156;--bg-color: #F8F9FA;--text-color: #212529;--text-muted: #6C757D;--card-bg: #FFFFFF;--card-bg-rgb: 255, 255, 255;--border-color: #DEE2E6;--shadow-color: rgba(0, 0, 0, 0.1);--accent-color: #198754;--dynamic-primary: var(--primary-color);--dynamic-secondary: var(--primary-light);--dynamic-accent: var(--accent-color);--dynamic-primary-rgb: var(--primary-color-rgb);--bounce: cubic-bezier(0.68, -0.55, 0.265, 1.55);--theme-transition-duration: 0.8s;--theme-transition-timing: cubic-bezier(0.4, 0, 0.2, 1);--interaction-transition-duration: 0.4s;--interaction-transition-timing: ease-out;--transition-theme-colors: background-color var(--theme-transition-duration) var(--theme-transition-timing), border-color var(--theme-transition-duration) var(--theme-transition-timing), color var(--theme-transition-duration) var(--theme-transition-timing), fill var(--theme-transition-duration) var(--theme-transition-timing), stroke var(--theme-transition-duration) var(--theme-transition-timing);--transition-interaction: transform var(--interaction-transition-duration) var(--interaction-transition-timing), box-shadow var(--interaction-transition-duration) var(--interaction-transition-timing), opacity var(--interaction-transition-duration) var(--interaction-transition-timing);--transition-combo: var(--transition-theme-colors), var(--transition-interaction);--will-change-theme-colors: background-color, border-color, color, fill, stroke;--will-change-interaction: transform, box-shadow, opacity;--will-change-combo: var(--will-change-theme-colors), var(--will-change-interaction);}[data-bs-theme="dark"] {--primary-color: #3B82F6;--primary-light: #60A5FA;--primary-color-rgb: 59, 130, 246;--bg-color: #121212;--text-color: #E9ECEF;--text-muted: #ADB5BD;--card-bg: #1E1E1E;--card-bg-rgb: 30, 30, 30;--border-color: #343A40;--shadow-color: rgba(0, 0, 0, 0.3);--accent-color: #20C997;}body.hero-theme {--dynamic-primary: #667eea;--dynamic-secondary: #764ba2;--dynamic-accent: #f093fb;--dynamic-primary-rgb: 102, 126, 234;}[data-bs-theme="dark"] body.hero-theme {--dynamic-primary: #8b5cf6;--dynamic-secondary: #a78bfa;--dynamic-accent: #c084fc;--dynamic-primary-rgb: 139, 92, 246;}body.about-theme {--dynamic-primary: #4facfe;--dynamic-secondary: #00f2fe;--dynamic-accent: #43e97b;--dynamic-primary-rgb: 79, 172, 254;}[data-bs-theme="dark"] body.about-theme {--dynamic-primary: #0ea5e9;--dynamic-secondary: #06b6d4;--dynamic-accent: #10b981;--dynamic-primary-rgb: 14, 165, 233;}body.creations-theme {--dynamic-primary: #fa709a;--dynamic-secondary: #fee140;--dynamic-accent: #ff6b6b;--dynamic-primary-rgb: 250, 112, 154;}[data-bs-theme="dark"] body.creations-theme {--dynamic-primary: #ec4899;--dynamic-secondary: #f59e0b;--dynamic-accent: #ef4444;--dynamic-primary-rgb: 236, 72, 153;}body.skills-theme {--dynamic-primary: #a8edea;--dynamic-secondary: #fed6e3;--dynamic-accent: #5ee7df;--dynamic-primary-rgb: 168, 237, 234;}[data-bs-theme="dark"] body.skills-theme {--dynamic-primary: #14b8a6;--dynamic-secondary: #8b5cf6;--dynamic-accent: #06b6d4;--dynamic-primary-rgb: 20, 184, 166;}body.contact-theme {--dynamic-primary: #d299c2;--dynamic-secondary: #fef9d7;--dynamic-accent: #89f7fe;--dynamic-primary-rgb: 210, 153, 194;}[data-bs-theme="dark"] body.contact-theme {--dynamic-primary: #a855f7;--dynamic-secondary: #3b82f6;--dynamic-accent: #06b6d4;--dynamic-primary-rgb: 168, 85, 247;}::selection {background: var(--dynamic-primary, #7b68ee);color: #fff;text-shadow: none;font-size: 0.97em;font-weight: 600;line-height: 1.1;letter-spacing: 0.01em;border-radius: 2px;padding: 0 0.1em;}body.hero-theme ::selection {background: var(--dynamic-primary, #667eea);color: #fff;font-size: 0.97em;font-weight: 600;line-height: 1.1;}body.about-theme ::selection {background: var(--dynamic-primary, #4facfe);color: #fff;font-size: 0.97em;font-weight: 600;line-height: 1.1;}body.creations-theme ::selection {background: var(--dynamic-primary, #fa709a);color: #fff;font-size: 0.97em;font-weight: 600;line-height: 1.1;}body.skills-theme ::selection {background: var(--dynamic-primary, #a8edea);color: #222;font-size: 0.97em;font-weight: 600;line-height: 1.1;}body.contact-theme ::selection {background: var(--dynamic-primary, #d299c2);color: #222;font-size: 0.97em;font-weight: 600;line-height: 1.1;}[data-bs-theme="dark"] ::selection {background: var(--dynamic-accent, #ff69b4);color: #fff;font-size: 0.97em;font-weight: 600;line-height: 1.1;}[data-bs-theme="dark"].hero-theme ::selection {background: var(--dynamic-accent, #c084fc);color: #fff;font-size: 0.97em;font-weight: 600;line-height: 1.1;}[data-bs-theme="dark"].about-theme ::selection {background: var(--dynamic-accent, #10b981);color: #fff;font-size: 0.97em;font-weight: 600;line-height: 1.1;}[data-bs-theme="dark"].creations-theme ::selection {background: var(--dynamic-accent, #ef4444);color: #fff;font-size: 0.97em;font-weight: 600;line-height: 1.1;}[data-bs-theme="dark"].skills-theme ::selection {background: var(--dynamic-accent, #06b6d4);color: #fff;font-size: 0.97em;font-weight: 600;line-height: 1.1;}[data-bs-theme="dark"].contact-theme ::selection {background: var(--dynamic-accent, #06b6d4);color: #fff;font-size: 0.97em;font-weight: 600;line-height: 1.1;}* {box-sizing: border-box;}body {font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;background-color: var(--bg-color);color: var(--text-color);transition: var(--transition-theme-colors);will-change: var(--will-change-theme-colors);overflow-x: hidden;}html {scroll-behavior: smooth;}.btn-primary, .btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-warning, .btn-outline-info {transition: var(--transition-combo) !important;will-change: var(--will-change-combo) !important;}.btn-primary {background-color: var(--dynamic-primary) !important;border-color: var(--dynamic-primary) !important;color: white !important;position: relative;overflow: hidden;}.btn-primary:hover {background-color: var(--dynamic-secondary) !important;border-color: var(--dynamic-secondary) !important;transform: translateY(-2px);box-shadow: 0 8px 25px rgba(var(--dynamic-primary-rgb), 0.3) !important;}.btn-primary:focus, .btn-primary:active {background-color: var(--dynamic-secondary) !important;border-color: var(--dynamic-secondary) !important;box-shadow: 0 0 0 0.2rem rgba(var(--dynamic-primary-rgb), 0.25) !important;}.btn-outline-primary {color: var(--dynamic-primary) !important;border-color: var(--dynamic-primary) !important;background-color: transparent !important;}.btn-outline-primary:hover {background-color: var(--dynamic-primary) !important;border-color: var(--dynamic-primary) !important;color: white !important;transform: translateY(-2px);box-shadow: 0 8px 25px rgba(var(--dynamic-primary-rgb), 0.3) !important;}.btn-outline-primary:focus, .btn-outline-primary:active {background-color: var(--dynamic-primary) !important;border-color: var(--dynamic-primary) !important;box-shadow: 0 0 0 0.2rem rgba(var(--dynamic-primary-rgb), 0.25) !important;}.btn-outline-secondary {color: var(--dynamic-accent) !important;border-color: var(--dynamic-accent) !important;}.btn-outline-secondary:hover {background-color: var(--dynamic-accent) !important;border-color: var(--dynamic-accent) !important;color: white !important;transform: translateY(-2px);}.btn-outline-success {color: var(--dynamic-secondary) !important;border-color: var(--dynamic-secondary) !important;}.btn-outline-success:hover {background-color: var(--dynamic-secondary) !important;border-color: var(--dynamic-secondary) !important;color: white !important;transform: translateY(-2px);}.btn-outline-warning {color: var(--dynamic-accent) !important;border-color: var(--dynamic-accent) !important;}.btn-outline-warning:hover {background-color: var(--dynamic-accent) !important;border-color: var(--dynamic-accent) !important;color: white !important;transform: translateY(-2px);}.btn-outline-info {color: var(--dynamic-primary) !important;border-color: var(--dynamic-primary) !important;}.btn-outline-info:hover {background-color: var(--dynamic-primary) !important;border-color: var(--dynamic-primary) !important;color: white !important;transform: translateY(-2px);}.btn-glass {background: rgba(255, 255, 255, 0.15);backdrop-filter: blur(2px);-webkit-backdrop-filter: blur(2px);border: 1px solid rgba(255, 255, 255, 0.3);box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);position: relative;overflow: hidden;}[data-bs-theme="dark"] .btn-glass {background: rgba(255, 255, 255, 0.08);border: 1px solid rgba(255, 255, 255, 0.15);box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);color: var(--bs-body-color);}.btn-glass:hover {background: rgba(255, 255, 255, 0.25);border-color: rgba(255, 255, 255, 0.4);box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);transform: translateY(-2px) scale(1.02);}[data-bs-theme="dark"] .btn-glass:hover {background: rgba(255, 255, 255, 0.15);border-color: rgba(255, 255, 255, 0.25);box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);}.btn-glass:active {background: rgba(255, 255, 255, 0.1);border-color: rgba(255, 255, 255, 0.2);box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);transform: translateY(0) scale(0.98);transition-duration: 0.1s;}[data-bs-theme="dark"] .btn-glass:active {background: rgba(0, 0, 0, 0.1);box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);}.btn-glass:focus, .btn-glass:focus-visible {outline: none;box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);}[data-bs-theme="dark"] .btn-glass:focus, [data-bs-theme="dark"] .btn-glass:focus-visible {box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);}.btn-glass.active {background: rgba(255, 255, 255, 0.12);border-color: rgba(255, 255, 255, 0.25);box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 2px 6px rgba(0, 0, 0, 0.1);transform: translateY(1px);color: var(--bs-body-color);}[data-bs-theme="dark"] .btn-glass.active {background: rgba(0, 0, 0, 0.15);border-color: rgba(255, 255, 255, 0.2);box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.5), 0 1px 3px rgba(0, 0, 0, 0.3);}.btn-glass.active:hover {transform: translateY(-1px) scale(1.02);}.no-hover-color.btn-glass:hover {background: rgba(255,255,255,0.15) !important;border-color: rgba(255,255,255,0.3) !important;color: inherit !important;}[data-bs-theme="dark"] .no-hover-color.btn-glass:hover {background: rgba(255,255,255,0.08) !important;border-color: rgba(255,255,255,0.15) !important;color: inherit !important;}.btn-round-glass {background: rgba(255, 255, 255, 0.1) !important;backdrop-filter: blur(2px) !important;-webkit-backdrop-filter: blur(2px) !important;border: 1px solid rgba(255, 255, 255, 0.2);}[data-bs-theme="dark"] .btn-round-glass {background: rgba(255, 255, 255, 0.08);border: 1px solid rgba(255, 255, 255, 0.15);}.btn-round-glass:hover {background: rgba(255, 255, 255, 0.2);}[data-bs-theme="dark"] .btn-round-glass:hover {background: rgba(255, 255, 255, 0.12);}.card-glass {background: rgba(255, 255, 255, 0.6) !important;}[data-bs-theme="dark"] .card-glass {background: rgba(30, 30, 30, 0.6) !important;}.badge.bg-primary {background-color: var(--dynamic-primary) !important;transition: var(--transition-combo) !important;will-change: var(--will-change-combo) !important;}.badge.bg-success {background-color: var(--dynamic-secondary) !important;transition: var(--transition-combo) !important;will-change: var(--will-change-combo) !important;}.badge.bg-warning {background-color: var(--dynamic-accent) !important;transition: var(--transition-combo) !important;will-change: var(--will-change-combo) !important;}.badge.bg-info {background-color: var(--dynamic-primary) !important;transition: var(--transition-combo) !important;will-change: var(--will-change-combo) !important;}.badge.bg-secondary {background-color: var(--dynamic-secondary) !important;transition: var(--transition-combo) !important;will-change: var(--will-change-combo) !important;}.badge.bg-danger {background-color: var(--dynamic-accent) !important;transition: var(--transition-combo) !important;will-change: var(--will-change-combo) !important;}.tech-stack .badge {transition: var(--transition-combo) !important;will-change: var(--will-change-combo) !important;}.skill-tags .badge {transition: var(--transition-combo) !important;will-change: var(--will-change-combo) !important;}.preloader {--bg-color: #f6f0ff;background-color: var(--bg-color);}[data-bs-theme="dark"] .preloader {--bg-color: #18122B;background-color: var(--bg-color);}.preloader {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: var(--bg-color);display: flex;align-items: center;justify-content: center;z-index: 9999;transition: opacity 0.5s ease-out;}.preloader.fade-out {opacity: 0;pointer-events: none;}.loader-svg {width: 100px;height: 100px;overflow: visible;}.loader-core {fill: var(--primary-color);transform-box: fill-box;transform-origin: center;animation: pulse 2s ease-in-out infinite;}.loader-ring {fill: none;stroke: var(--primary-color);stroke-width: 1;opacity: 0.3;transform-box: fill-box;transform-origin: center;animation: ripple 2s ease-out infinite;}.loader-ring-1 {animation-delay: 0s;}.loader-ring-2 {animation-delay: 0.5s;}.loader-ring-3 {animation-delay: 1s;}@keyframes pulse {0%, 100% {transform: scale(1);opacity: 1;}50% {transform: scale(1.1);opacity: 0.8;}}@keyframes ripple {0% {transform: scale(0.8);opacity: 0.8;}100% {transform: scale(1.2);opacity: 0;}}.hero-section {background: linear-gradient(135deg, var(--bg-color) 0%, rgba(var(--primary-color), 0.05) 100%);position: relative;}.hero-background {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-image: radial-gradient(circle at 20% 30%, rgba(var(--primary-color), 0.1) 1px, transparent 1px), radial-gradient(circle at 80% 70%, rgba(var(--accent-color), 0.1) 1px, transparent 1px);background-size: 100px 100px, 150px 150px;animation: float 20s ease-in-out infinite;}.hero-title {font-weight: 300;color: var(--primary-color);margin-bottom: 2rem;}.hero-tagline {display: flex;justify-content: center;}.typewriter-text {font-size: 1.25rem;line-height: 1.6;color: var(--text-muted);max-width: 500px;margin: 0 auto;}.typewriter-text {overflow: hidden;white-space: nowrap;animation: typing 3s steps(50) 1s both;}@keyframes typing {from {width: 0;}to {width: 90%;}}@keyframes blink {50% {border-color: transparent;}}@media (max-width: 768px) {.typewriter-text {white-space: normal;animation: none;border-right: none;}}.hero-social {margin: 3rem 0;}.hero-social .social-link {color: var(--text-muted);transition: var(--transition-combo);will-change: var(--will-change-combo);display: inline-block;}.hero-social .social-link:hover {color: var(--dynamic-primary);transform: translateY(-3px);}.hero-cta .btn {margin: 0.5rem;padding: 12px 30px;font-weight: 500;}.scroll-indicator {position: absolute;bottom: 30px;left: 50%;transform: translateX(-50%);animation: bounce 2s infinite;color: var(--text-muted);font-size: 1.5rem;}.about-section {background: transparent;min-height: 80vh;display: flex;align-items: center;}.about-image {text-align: center;margin-bottom: 2rem;}.image-placeholder {width: 300px;height: 300px;border-radius: 20px;background: linear-gradient(135deg, var(--dynamic-primary), var(--dynamic-accent));display: flex;flex-direction: column;align-items: center;justify-content: center;color: white;margin: 0 auto;box-shadow: 0 10px 30px var(--shadow-color);}.about-content h2 {color: var(--dynamic-primary);font-weight: 300;}.about-text {line-height: 1.8;}.about-text p {margin-bottom: 1.5rem;}.creations-section {background: transparent;}.nav-pills .nav-link {border-radius: 25px;padding: 12px 24px;font-weight: 500;color: var(--text-muted);background: transparent;border: 1px solid var(--border-color);transition: var(--transition-combo);will-change: var(--will-change-combo);}.nav-pills .nav-link.active {background: var(--dynamic-primary);color: white;border-color: var(--dynamic-primary);}.nav-pills .nav-link:hover {background: var(--dynamic-primary);color: white;border-color: var(--dynamic-primary);}.nav-pills .nav-item {margin: 0 10px;}.project-card {background: var(--card-bg);border: 1px solid var(--border-color);transition: var(--transition-combo);will-change: var(--will-change-combo);overflow: hidden;border-radius: 15px;}.project-card:hover {transform: translateY(-8px);box-shadow: 0 15px 40px rgba(var(--dynamic-primary-rgb), 0.2);border-color: var(--dynamic-primary);}.card-img-container {height: 160px;overflow: hidden;}.project-placeholder-img {height: 100%;background: linear-gradient(135deg, var(--dynamic-primary), var(--dynamic-accent));color: white;transition: var(--transition-combo);will-change: var(--will-change-combo);}.project-card:hover .project-placeholder-img {transform: scale(1.05);}.art-content {padding-right: 2rem;}.photography-showcase {display: flex;flex-direction: column;gap: 1rem;}.photo-placeholder {height: 120px;background: var(--border-color);border-radius: 10px;display: flex;flex-direction: column;align-items: center;justify-content: center;color: var(--text-muted);}.art-card {background: var(--card-bg);border: 1px solid var(--border-color);transition: var(--transition-combo);will-change: var(--will-change-combo);border-radius: 15px;}.art-card:hover {transform: translateY(-5px);box-shadow: 0 10px 25px var(--shadow-color);}.tech-projects-container {display: flex;gap: 2rem;min-height: 500px;}.project-description-panel {flex: 1 1 33.333%;background: var(--card-bg);border: 1px solid var(--border-color);border-radius: 15px;padding: 2rem;height: fit-content;min-height: 400px;transition: var(--transition-combo);will-change: var(--will-change-combo);box-shadow: 0 4px 20px rgba(var(--primary-color-rgb), 0.1);}.project-description-panel h3 {text-align: center;color: var(--text-color);margin-bottom: 1.5rem;font-size: 1.5rem;font-weight: 600;}.project-description-divider {height: 2px;background: linear-gradient(90deg, transparent, var(--primary-color), transparent);margin-bottom: 1.5rem;border: none;}.project-description-content {color: var(--text-muted);line-height: 1.6;font-size: 0.95rem;}.mobile-back-btn {display: none;}.project-cards-panel {flex: 1 1 66.666%;}.tech-project-card {background: var(--card-bg);border: 1px solid var(--border-color);border-radius: 12px;overflow: hidden;cursor: pointer;transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);height: 100%;min-height: 200px;position: relative;}.tech-project-card:hover {transform: translateY(-4px);box-shadow: 0 8px 25px rgba(var(--primary-color-rgb), 0.15);border-color: var(--primary-color);}.tech-project-card.active {border-color: var(--primary-color);box-shadow: 0 6px 20px rgba(var(--primary-color-rgb), 0.2);transform: translateY(-2px);}.tech-project-card.active::before {content: '';position: absolute;top: 0;left: 0;right: 0;height: 3px;background: linear-gradient(90deg, var(--primary-color), var(--primary-light));}.tech-card-img-container {height: 80px;overflow: hidden;display: flex;align-items: center;justify-content: center;}.tech-project-placeholder-img {height: 100%;width: 100%;background: linear-gradient(135deg, var(--primary-color), var(--primary-light));color: white;display: flex;align-items: center;justify-content: center;transition: all 0.3s ease;position: relative;overflow: hidden;}.tech-project-placeholder-img::before {content: '';position: absolute;top: 0;left: -500%;width: 600%;height: 100%;background: linear-gradient( 90deg, transparent 0%, transparent 15%, rgba(255, 255, 255, 0.02) 20%, rgba(255, 255, 255, 0.05) 25%, rgba(255, 255, 255, 0.08) 30%, rgba(255, 255, 255, 0.12) 35%, rgba(255, 255, 255, 0.15) 40%, rgba(255, 255, 255, 0.18) 45%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.18) 55%, rgba(255, 255, 255, 0.15) 60%, rgba(255, 255, 255, 0.12) 65%, rgba(255, 255, 255, 0.08) 70%, rgba(255, 255, 255, 0.05) 75%, rgba(255, 255, 255, 0.02) 80%, transparent 85%, transparent 100% );animation: shimmer-flow-elegant 10s ease-in-out infinite;z-index: 1;opacity: 0.7;}.tech-project-placeholder-img i {position: relative;z-index: 2;}.tech-project-card:hover .tech-project-placeholder-img {transform: scale(1.05);}.tech-project-card:hover .tech-project-placeholder-img::before {animation-duration: 4s;opacity: 1;}@keyframes shimmer-flow-elegant {0% {left: -500%;opacity: 0;}5% {opacity: 0.7;}95% {opacity: 0.7;}100% {left: 100%;opacity: 0;}}.tech-project-card .card-body {padding: 1rem;}.tech-project-card .card-title {font-size: 1rem;font-weight: 600;margin-bottom: 0.5rem;color: var(--text-color);}.tech-project-card .card-text {font-size: 0.85rem;margin-bottom: 0.75rem;line-height: 1.4;}.tech-project-card .tech-stack {margin-bottom: 0.75rem;}.tech-project-card .badge {font-size: 0.7rem;padding: 0.25rem 0.5rem;}.tech-project-card .btn-sm {font-size: 0.75rem;padding: 0.375rem 0.75rem;}@media (max-width: 768px) {.tech-projects-container {flex-direction: column;gap: 1.5rem;position: relative;}.project-description-panel {order: 1;min-height: 300px;position: absolute;top: 0;left: 0;right: 0;z-index: 10;transform: translateX(100%);transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);opacity: 0;visibility: hidden;margin: 0;height: auto;}.project-description-panel.mobile-active {transform: translateX(0);opacity: 1;visibility: visible;animation: projectDetailSlideIn 0.4s ease-out forwards;}@keyframes projectDetailSlideIn {0% {transform: translateX(100%);opacity: 0;}60% {transform: translateX(-5%);opacity: 0.8;}100% {transform: translateX(0);opacity: 1;}}.project-description-panel.mobile-leaving {animation: projectDetailSlideOut 0.3s ease-in forwards;}@keyframes projectDetailSlideOut {0% {transform: translateX(0);opacity: 1;}100% {transform: translateX(100%);opacity: 0;}}.project-cards-panel {order: 2;transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);}.project-cards-panel.mobile-hidden {transform: translateX(-100%);opacity: 0;visibility: hidden;animation: projectListSlideOut 0.3s ease-in forwards;}@keyframes projectListSlideOut {0% {transform: translateX(0);opacity: 1;}100% {transform: translateX(-100%);opacity: 0;}}.project-cards-panel.mobile-entering {animation: projectListSlideIn 0.4s ease-out forwards;}@keyframes projectListSlideIn {0% {transform: translateX(-100%);opacity: 0;}60% {transform: translateX(5%);opacity: 0.8;}100% {transform: translateX(0);opacity: 1;}}.mobile-back-btn {display: none;width: 100%;padding: 0.75rem 1rem;margin-bottom: 1.5rem;border-radius: 12px;font-size: 0.9rem;font-weight: 500;cursor: pointer;position: relative;overflow: hidden;background: rgba(255, 255, 255, 0.15);backdrop-filter: blur(8px);-webkit-backdrop-filter: blur(8px);border: 1px solid rgba(255, 255, 255, 0.3);box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);color: var(--text-color);transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);}[data-bs-theme="dark"] .mobile-back-btn {background: rgba(255, 255, 255, 0.08);border: 1px solid rgba(255, 255, 255, 0.15);box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);}.mobile-back-btn:hover {background: rgba(var(--primary-color-rgb), 0.8);border-color: var(--primary-color);color: white;transform: translateY(-2px) scale(1.02);box-shadow: 0 8px 24px rgba(var(--primary-color-rgb), 0.3);}[data-bs-theme="dark"] .mobile-back-btn:hover {background: rgba(var(--primary-color-rgb), 0.9);box-shadow: 0 8px 24px rgba(var(--primary-color-rgb), 0.4);}.mobile-back-btn:active {transform: translateY(0) scale(0.98);background: rgba(var(--primary-color-rgb), 0.6);box-shadow: 0 2px 8px rgba(var(--primary-color-rgb), 0.4);transition-duration: 0.1s;}.mobile-back-btn i {transition: transform 0.3s ease;}.mobile-back-btn:hover i {transform: translateX(-3px);}.tech-project-card {min-height: 180px;transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);}.tech-project-card:active {transform: scale(0.98);}.tech-card-img-container {height: 70px;}.tech-projects-container {min-height: 500px;overflow: visible;}}@media (max-width: 768px) {.mobile-back-btn {display: flex !important;align-items: center;justify-content: center;}}[data-bs-theme="dark"] .project-description-panel {background: var(--card-bg);border-color: var(--border-color);}[data-bs-theme="dark"] .tech-project-card {background: var(--card-bg);border-color: var(--border-color);}[data-bs-theme="dark"] .tech-project-card:hover {border-color: var(--primary-color);}.card-glow-breathe {animation: breathe-glow-scale 4s ease-in-out infinite;transition: all 0.3s ease;}.card-glow-breathe:hover {animation-play-state: paused;transform: translateY(-5px) scale(1.02);box-shadow: 0 15px 35px rgba(0, 123, 255, 0.3);opacity: 1;}@keyframes breathe-glow-scale {0%, 100% {transform: translateY(0px) scale(1);box-shadow: 0 5px 15px rgba(0, 123, 255, 0.1);opacity: 0.9;}50% {transform: translateY(-3px) scale(1.015);box-shadow: 0 10px 25px rgba(0, 123, 255, 0.2);opacity: 1;}}.skills-section {background: rgba(var(--bg-color), 0.5);}[data-bs-theme="dark"] .skills-section {background: rgba(var(--card-bg), 0.3);}.skill-card {background: var(--card-bg);border: 1px solid var(--border-color);transition: var(--transition-combo);will-change: var(--will-change-combo);border-radius: 15px;position: relative;overflow: hidden;}.skill-card::before {content: '';position: absolute;top: 0;left: -100%;width: 100%;height: 100%;background: linear-gradient(90deg, transparent, rgba(var(--dynamic-primary-rgb), 0.1), transparent);transition: left 0.6s ease;}.skill-card:hover::before {left: 100%;}.skill-card:hover {transform: translateY(-8px);box-shadow: 0 15px 35px rgba(var(--dynamic-primary-rgb), 0.15);border-color: var(--dynamic-primary);}.skill-icon {transition: var(--transition-interaction);will-change: var(--will-change-interaction);}.skill-card:hover .skill-icon {transform: scale(1.1);}.skill-category {text-align: left;}.skill-tags .badge {margin: 0.125rem;transition: var(--transition-interaction);will-change: var(--will-change-interaction);}.skill-card:hover .skill-tags .badge {transform: scale(1.05);}.achievement-badge {margin-bottom: 0.5rem;}.text-purple {color: #6f42c1 !important;}@media (max-width: 370px) {.skill-card .card-body {flex-direction: column !important;text-align: center;}.skill-card .vr {display: none;}.skill-card .fa-3x {font-size: 2em !important;}}.contact-section {background: transparent;position: relative;min-height: 90vh;display: flex;align-items: center;justify-content: center;}.email-container {position: relative;}#emailBtn {background: rgba(106, 13, 173, 0.5)!important;border: none;transition: var(--transition-combo);will-change: var(--will-change-combo);width: 45px;height: 45px;display: flex;align-items: center;justify-content: center;border-radius: 50%;}#emailBtn:hover {transform: translateY(-2px);box-shadow: 0 8px 25px rgba(var(--dynamic-primary-rgb), 0.3);}#copyEmailBtn {transition: var(--transition-interaction);will-change: var(--will-change-interaction);border-radius: 50%;width: 45px;height: 45px;display: flex;align-items: center;justify-content: center;}#copyEmailBtn:hover {background: var(--accent-color);border-color: var(--accent-color);color: white;transform: scale(1.1);}.copy-success {position: absolute;top: 100%;left: 50%;transform: translateX(-50%);background: var(--accent-color);color: rgb(0, 0, 0);padding: 0.5rem 1rem;border-radius: 0.5rem;margin-top: 0.5rem;animation: slideUp 0.3s ease-out;box-shadow: 0 4px 12px var(--shadow-color);}[data-bs-theme="dark"] .copy-success {color: #fff;}.social-links {margin-top: 2rem;}.social-link {color: var(--text-muted);transition: var(--transition-combo);will-change: var(--will-change-combo);display: inline-block;margin: 0 1rem;}.social-link:hover {color: var(--primary-color);transform: translateY(-3px);}.color-animate {animation: colorChange 10s infinite linear;display: inline-block;}@keyframes colorChange {0% {color: var(--dynamic-primary);}50% {color: var(--dynamic-accent);}100% {color: var(--dynamic-primary);}}.display-4[data-zh="建立"], .display-4[data-zh="连接"] {display: inline-block;margin-bottom: 0;}.btn-design-story {border: none !important;border-radius: 999px !important;box-shadow: 0 4px 24px rgba(102,126,234,0.25), inset 0 1px 6px rgba(102,126,234,0.10) !important;padding: 0.7em 1.5em !important;}.back-to-top {position: fixed;bottom: 20px;right: 20px;width: 50px;height: 50px;border: none;border-radius: 50%;background: var(--dynamic-accent);color: white;z-index: 1000;cursor: pointer;transition: var(--transition-combo);will-change: var(--will-change-combo);opacity: 0;transform: translateY(100px);box-shadow: 0 4px 12px var(--shadow-color);}.back-to-top.show {opacity: 1;transform: translateY(0);}.back-to-top:hover {background: var(--accent-color);transform: translateY(-3px) scale(1.1);}[data-lang="en"] {display: none;}[data-lang="zh"] {display: block;}body.lang-en [data-lang="zh"] {display: none;}body.lang-en [data-lang="en"] {display: block;}@media (max-width: 768px) {.mobile-navbar {display: block !important;}.global-controls{display: none !important;}.speedometer-hint {right: 5px !important;}.card{margin: 0 10px;}.back-to-top {display: block;bottom: 10px;right: 10px;width: 40px;height: 40px;}.nav-dots {display: none;}.hero-title {font-size: 3rem;}.typewriter-text {font-size: 1.1rem;}.about-image {margin-bottom: 3rem;}.image-placeholder {width: 250px;height: 250px;}.art-content {padding-right: 0;margin-bottom: 2rem;}.photography-showcase {flex-direction: row;overflow-x: auto;gap: 0.5rem;}.photo-placeholder {min-width: 100px;height: 80px;}.scroll-indicator {bottom: 20px;}}@media (min-width: 769px) {.mobile-navbar {display: none !important;}.back-to-top {display: none !important;}}.nav-speedometer, .speedometer-hint, .global-controls {display: flex;}@media (min-width: 768px) and (max-width: 991px) {.image-placeholder {width: 250px;height: 250px;margin: 0 auto;}.art-content {padding-right: 0;margin-bottom: 2rem;}.photography-showcase {justify-content: center;}.photography-showcase {justify-content: center;}}@media (max-width: 991px) {.art-content {padding-right: 0;margin-bottom: 2rem;}}@media (max-width: 576px) {.mobile-navbar .navbar-brand {font-size: 1rem;}.mobile-lang-toggle, .mobile-theme-toggle {font-size: 10px;padding: 4px 8px;}.mobile-theme-toggle {width: 32px;height: 32px;}.nav-dots {display: none;}.hero-title {font-size: 2.5rem;}.typewriter-text {font-size: 1rem;}.image-placeholder {width: 200px;height: 200px;}.nav-pills .nav-link {padding: 8px 16px;font-size: 0.9rem;}.skill-category h6 {font-size: 0.9rem;}.skill-category p {font-size: 0.8rem;}}@keyframes slideUp {from {opacity: 0;transform: translateX(-50%) translateY(10px);}to {opacity: 1;transform: translateX(-50%) translateY(0);}}@keyframes bounce {0%, 20%, 50%, 80%, 100% {transform: translateX(-50%) translateY(0);}40% {transform: translateX(-50%) translateY(-10px);}60% {transform: translateX(-50%) translateY(-5px);}}@keyframes float {0%, 100% {transform: translateY(0px);}50% {transform: translateY(-10px);}}.guide-text {z-index: 10;}.scroll-indicator {animation: bounce 2s infinite;}@keyframes bounce {0%, 20%, 50%, 80%, 100% {transform: translateY(0);}40% {transform: translateY(-10px);}60% {transform: translateY(-5px);}}.project-card {background: var(--card-bg);border: 1px solid var(--border-color);transition: var(--transition-combo);will-change: var(--will-change-combo);overflow: hidden;}.project-card:hover {transform: translateY(-5px);box-shadow: 0 10px 30px var(--shadow-color);}.card-img-container {height: 200px;overflow: hidden;}.project-placeholder-img {height: 100%;background: linear-gradient(135deg, var(--primary-color), var(--accent-color));color: white;transition: var(--transition-combo);will-change: var(--will-change-combo);}.project-card:hover .project-placeholder-img {transform: scale(1.05);}.connection-point {padding: 0.5rem;background: rgba(var(--primary-color), 0.05);border-radius: 0.5rem;border: 1px dashed var(--border-color);}.tech-stack .badge {margin-right: 0.25rem;margin-bottom: 0.25rem;}.skills-diagram-container {display: flex;justify-content: center;align-items: center;min-height: 90vh;position: relative;z-index: 1;}.skills-diagram {position: relative;width: 300px;height: 300px;display: flex;justify-content: center;align-items: center;}.skill-card-wrapper {position: absolute;width: 280px;transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);}.center-card-wrapper {position: relative;z-index: 10;transition: transform 0.3s ease-in-out;cursor: pointer;}.center-card-wrapper::after {content: '';position: absolute;width: 150%;height: 150%;top: 50%;left: 50%;transform: translate(-50%, -50%);border-radius: 50%;background-color: transparent;z-index: -1;}.skills-diagram:hover .center-card-wrapper {transform: scale(1.05);}.center-card-wrapper .skill-card {min-height: 280px;}.satellite-cards-container {position: absolute;top: 0;left: 0;width: 100%;height: 100%;animation: rotate-continuously 25s linear infinite;animation-play-state: paused;animation-delay: -1.1s;}.center-card-wrapper:hover ~ .satellite-cards-container {animation-play-state: running;}.satellite-positioner {--distance: 220px;position: absolute;top: 50%;left: 50%;width: 280px;height: 280px;margin: -140px 0 0 -140px;transform: translate(var(--translateX), var(--translateY));}.satellite-positioner:nth-child(1) {--translateX: calc(-1 * var(--distance));--translateY: calc(-1 * var(--distance));}.satellite-positioner:nth-child(2) {--translateX: var(--distance);--translateY: calc(-1 * var(--distance));}.satellite-positioner:nth-child(3) {--translateX: calc(-1 * var(--distance));--translateY: var(--distance);}.satellite-positioner:nth-child(4) {--translateX: var(--distance);--translateY: var(--distance);}.skill-card-wrapper.satellite-card-wrapper {position: relative;width: 100%;height: 100%;animation: breathe-scale 5s ease-in-out infinite;}.satellite-positioner:nth-child(1) .satellite-card-wrapper {animation-delay: 0s;}.satellite-positioner:nth-child(2) .satellite-card-wrapper {animation-delay: 1.25s;}.satellite-positioner:nth-child(3) .satellite-card-wrapper {animation-delay: 2.5s;}.satellite-positioner:nth-child(4) .satellite-card-wrapper {animation-delay: 3.75s;}.satellite-positioner:nth-child(1) .satellite-card-wrapper .skill-card::before {animation-delay: 0s;}.satellite-positioner:nth-child(2) .satellite-card-wrapper .skill-card::before {animation-delay: 1.25s;}.satellite-positioner:nth-child(3) .satellite-card-wrapper .skill-card::before {animation-delay: 2.5s;}.satellite-positioner:nth-child(4) .satellite-card-wrapper .skill-card::before {animation-delay: 3.75s;}.satellite-card-wrapper .skill-card {position: relative;background: transparent !important;border: none;overflow: hidden;animation: counter-rotate 25s linear infinite;animation-play-state: paused;animation-delay: -1.1s;}.card-background-layer {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: -1;background-color: #fff;border: 1px solid rgba(0, 0, 0, 0.1);box-shadow: inset 0 0 20px 5px rgba(var(--dynamic-primary-rgb), 0.05), inset 0 0 100px 60px rgba(var(--dynamic-primary-rgb), 0.10);transition: var(--transition-theme-colors), box-shadow 0.3s ease;border-radius: var(--bs-card-border-radius, 0.375rem);animation: breathe-opacity 5s ease-in-out infinite;}[data-bs-theme="dark"] .card-background-layer {background-color: #212529;}.satellite-positioner:nth-child(1) .card-background-layer {animation-delay: 0s;}.satellite-positioner:nth-child(2) .card-background-layer {animation-delay: 1.25s;}.satellite-positioner:nth-child(3) .card-background-layer {animation-delay: 2.5s;}.satellite-positioner:nth-child(4) .card-background-layer {animation-delay: 3.75s;}.center-card-wrapper:hover ~ .satellite-cards-container .satellite-card-wrapper .skill-card, .center-card-wrapper:hover ~ .satellite-cards-container .card-background-layer {animation-play-state: running;}@media (max-width: 750px) {.satellite-cards-container, .satellite-card-wrapper .skill-card, .card-background-layer {animation-duration: 40s !important;animation-play-state: running !important;}.card-background-layer {animation-duration: 5s !important;}.skills-diagram:hover .satellite-cards-container, .skills-diagram:hover .satellite-card-wrapper .skill-card, .skills-diagram:hover .card-background-layer {animation-play-state: paused !important;}}@keyframes rotate-continuously {from {transform: rotate(0deg);}to {transform: rotate(360deg);}}@keyframes counter-rotate {from {transform: rotate(0deg);}to {transform: rotate(-360deg);}}@keyframes breathe-scale {0%, 100% {transform: scale(1.0);}50% {transform: scale(1.05);}}@keyframes breathe-opacity {0%, 100% {opacity: 0.7;}50% {opacity: 0.9;}}.severeLagWarning {position: fixed;bottom: 20px;left: 50%;transform: translateX(-50%);z-index: 10000;max-width: 90vw;width: auto;padding: 16px 24px;margin: 0;background: rgba(var(--glass-bg), 0.95);backdrop-filter: blur(20px);-webkit-backdrop-filter: blur(20px);border: 1px solid rgba(var(--border-color), 0.3);border-radius: 12px;box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1), 0 4px 16px rgba(0, 0, 0, 0.05), inset 0 1px 0 rgba(255, 255, 255, 0.1);color: var(--text-primary);font-size: 14px;font-weight: 500;text-align: center;line-height: 1.4;cursor: pointer;user-select: none;display: none;transition: all 0.3s ease;@media (max-width: 576px) {bottom: 15px;padding: 12px 18px;font-size: 13px;max-width: 95vw;}}.severeLagWarning i {color: #ff9500;margin-right: 8px;font-size: 16px;vertical-align: middle;}.severeLagWarning:hover {background: rgba(var(--glass-bg), 1);border-color: rgba(var(--border-color), 0.5);transform: translateX(-50%) translateY(-2px);box-shadow: 0 12px 48px rgba(0, 0, 0, 0.15), 0 6px 24px rgba(0, 0, 0, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.15);}.severeLagWarning:active {transform: translateX(-50%) translateY(0px);box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1), 0 2px 8px rgba(0, 0, 0, 0.05), inset 0 1px 0 rgba(255, 255, 255, 0.1);}.severeLagWarning.show {display: block;animation: lagWarningSlideIn 0.4s ease-out forwards;}.severeLagWarning.hide {animation: lagWarningSlideOut 0.3s ease-in forwards;}@keyframes lagWarningSlideIn {0% {opacity: 0;transform: translateX(-50%) translateY(20px);}100% {opacity: 1;transform: translateX(-50%) translateY(0);}}@keyframes lagWarningSlideOut {0% {opacity: 1;transform: translateX(-50%) translateY(0);}100% {opacity: 0;transform: translateX(-50%) translateY(20px);}}