.projects-list{display:flex;flex-direction:column;gap:1rem;width:100%}.project-card{display:flex;flex-direction:column;padding:1.2rem 1.4rem;background-color:transparent;border:1px solid var(--border-color);transition:all var(--transition);position:relative;animation:cardFadeIn .5s ease both}@keyframes cardFadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.project-card:hover{border-color:var(--border-hover);background-color:#ffffff05;transform:translateY(-3px);box-shadow:0 6px 24px #00000040}.project-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.project-name{font-family:var(--font-heading);font-size:1.05rem;font-weight:500;color:var(--text-active);letter-spacing:.02em}.project-arrow{color:var(--text-secondary);opacity:0;transform:translate(-4px,4px);transition:all var(--transition)}.project-card:hover .project-arrow{opacity:1;transform:translate(0)}.project-desc{font-size:.88rem;font-weight:300;color:var(--text-secondary);line-height:1.6;margin-bottom:.8rem}.project-footer{display:flex;justify-content:space-between;align-items:center;font-size:.78rem;color:var(--text-secondary)}.project-lang{display:flex;align-items:center;gap:.4rem;font-weight:400;letter-spacing:.03em}.lang-dot{width:7px;height:7px;border-radius:50%;display:inline-block;flex-shrink:0}.project-stats{display:flex;gap:.8rem}.project-stats span{display:flex;align-items:center;gap:.25rem;font-weight:300}.view-more-link{font-family:var(--font-body);font-size:.85rem;font-weight:400;margin-top:.8rem;color:var(--text-secondary);transition:color var(--transition-fast);text-align:right;display:inline-block;letter-spacing:.03em}.view-more-link:hover{color:var(--text-active)}.state-msg{font-size:.9rem;font-weight:300;color:var(--text-secondary);padding:1rem 0}.error-notice{margin-bottom:1.5rem;padding:1rem;border-left:2px solid #ff4d4d;background:#ff4d4d0d;display:flex;flex-direction:column;gap:.8rem;animation:cardFadeIn .5s ease both}.error-text{font-size:.85rem;color:#ffb3b3;font-weight:400;margin:0}.retry-btn{background:transparent;border:1px solid rgba(255,255,255,.1);color:var(--text-active);padding:.4rem .8rem;font-size:.75rem;font-family:var(--font-mono);cursor:pointer;transition:all var(--transition-fast);width:fit-content;text-transform:uppercase;letter-spacing:.05em}.retry-btn:hover{background:#ffffff0d;border-color:var(--text-active)}.tech-stack{display:flex;flex-direction:column;gap:1.6rem}.tech-category{display:flex;flex-direction:column;gap:.6rem}.tech-cat-title{font-family:var(--font-heading);font-size:.68rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--text-secondary)}.tech-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(85px,1fr));gap:1rem}.tech-chip{font-family:var(--font-body);font-size:.75rem;font-weight:500;letter-spacing:.04em;color:var(--text-secondary);background:#ffffff04;border:1px solid var(--border-color);border-radius:8px;padding:1rem .5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem;transition:color .3s ease,border-color .3s ease,background .3s ease,box-shadow .3s ease,transform .3s ease;cursor:default}.tech-icon-mask{width:32px;height:32px;background-color:var(--text-secondary);-webkit-mask:var(--icon-url) center/contain no-repeat;mask:var(--icon-url) center/contain no-repeat;transition:background-color .3s ease,transform .3s ease,filter .3s ease;flex-shrink:0;opacity:.6}.tech-chip:hover{color:var(--text-primary);border-color:var(--hover-color);background:#ffffff08;box-shadow:0 8px 24px color-mix(in srgb,var(--hover-color) 15%,transparent);transform:translateY(-2px)}.tech-chip:hover .tech-icon-mask{background-color:var(--hover-color);opacity:1;filter:drop-shadow(0 0 8px color-mix(in srgb,var(--hover-color) 50%,transparent));transform:scale(1.1)}@media (max-width: 800px){.tech-icon-mask{background-color:var(--hover-color);opacity:.95;filter:drop-shadow(0 0 6px color-mix(in srgb,var(--hover-color) 40%,transparent))}.tech-chip{border-color:color-mix(in srgb,var(--hover-color) 40%,transparent);background:#ffffff05}.tech-chip:active{transform:scale(.95);background:#ffffff0d}}.mini-game{padding:1rem 0;display:flex;align-items:center;gap:1.2rem}.mini-game.active{flex-direction:column;align-items:stretch}.game-start-btn{background:none;border:1px solid var(--border-color);color:var(--text-secondary);font-family:var(--font-body);font-size:.78rem;font-weight:400;letter-spacing:.1em;padding:.5rem 1.2rem;transition:all var(--transition);text-transform:uppercase}.game-start-btn:hover{border-color:var(--accent);color:var(--text-active);background:#ffffff08}.game-hud{display:flex;justify-content:space-between;align-items:center;margin-bottom:.6rem}.game-timer{font-family:var(--font-heading);font-size:.8rem;font-weight:300;color:var(--text-secondary);letter-spacing:.1em}.game-score{font-family:var(--font-heading);font-size:1.1rem;font-weight:500;color:var(--text-active)}.game-word{display:flex;gap:.15rem;margin-bottom:.6rem}.game-char{font-family:"IBM Plex Mono",var(--font-body);font-size:1.5rem;font-weight:400;color:var(--text-secondary);letter-spacing:.08em;transition:color .15s ease}.game-char.correct{color:#4ade80}.game-char.wrong{color:#f87171}.game-input{background:transparent;border:none;border-bottom:1px solid var(--border-color);color:var(--text-active);font-family:"IBM Plex Mono",var(--font-body);font-size:1rem;padding:.4rem 0;outline:none;caret-color:var(--accent);letter-spacing:.08em;width:100%}.game-input:focus{border-bottom-color:var(--accent)}.game-result{display:flex;align-items:baseline;gap:.6rem}.game-score-final{font-family:var(--font-heading);font-size:2rem;font-weight:200;color:var(--text-active)}.game-score-label{font-family:var(--font-body);font-size:.78rem;font-weight:300;color:var(--text-secondary);letter-spacing:.05em}.page{width:100vw;height:100vh;overflow:hidden;position:relative}.hero-fullscreen{position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;z-index:10;will-change:transform,opacity;transition:opacity .8s cubic-bezier(.65,0,.35,1),transform .8s cubic-bezier(.65,0,.35,1)}.hero-fullscreen.collapsed{opacity:0;transform:scale(.96) translateY(-30px);pointer-events:none}.hero-content{max-width:680px;width:90%;animation:heroFadeIn 1s ease both}@keyframes heroFadeIn{0%{opacity:0;transform:translateY(30px);filter:blur(6px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}.hero-name-full{font-family:var(--font-name);font-size:clamp(5rem,14vw,9rem);font-weight:500;letter-spacing:.02em;color:var(--text-primary);opacity:.85;line-height:1;margin-bottom:.6rem;animation:heroFadeIn 1s ease .2s both}.hero-subtitle-full{font-family:var(--font-body);font-size:1.15rem;font-weight:300;color:var(--text-secondary);letter-spacing:.02em;line-height:1.6;margin-bottom:.5rem;animation:heroFadeIn 1s ease .4s both}.hero-subtitle-full strong{color:var(--text-primary);font-weight:500}.hero-game{animation:heroFadeIn 1s ease .6s both}.hero-about{margin-top:1.5rem;animation:heroFadeIn 1s ease .8s both}.hero-contact{margin-top:2rem;color:var(--text-secondary);font-size:.92rem;font-weight:300;line-height:1.8;animation:heroFadeIn 1s ease 1s both}.hero-contact strong{font-weight:500}.hero-contact a{color:var(--text-primary);border-bottom:1px solid transparent;transition:border-color var(--transition-fast),color var(--transition-fast)}.hero-contact a:hover{color:var(--text-active);border-color:#4dffe1}.hero-scroll-cue{position:fixed;bottom:3rem;left:50%;transform:translate(-50%);animation:heroFadeIn 1.5s ease 1.3s both}.hero-fullscreen.collapsed .hero-scroll-cue{opacity:0}.scroll-cue-line{width:1px;height:40px;position:relative;overflow:hidden}.scroll-cue-line:after{content:"";position:absolute;top:-100%;left:0;width:1px;height:100%;background:linear-gradient(to bottom,transparent,var(--text-secondary),transparent);animation:scrollLine 1.8s ease-in-out infinite}@keyframes scrollLine{0%{top:-100%}to{top:200%}}.section-label{font-family:var(--font-heading);font-size:.75rem;font-weight:500;letter-spacing:.22em;margin-bottom:.8rem;text-transform:uppercase;color:#30e8c9}.section-divider{width:100%;height:1px;background:linear-gradient(to right,var(--border-hover),transparent 70%);margin-bottom:1.2rem}.about-text{font-size:.92rem;font-weight:300;line-height:1.85;color:var(--text-secondary);letter-spacing:.01em}.about-text strong{color:var(--text-primary);font-weight:500}.page.layout-mode{display:grid;grid-template-columns:140px 1fr 480px}.sidebar{display:flex;flex-direction:column;padding:3rem 1.8rem;height:100vh;position:relative;opacity:0;transform:translate(-20px);transition:opacity .7s ease .2s,transform .7s ease .2s;pointer-events:none}.sidebar.show{opacity:1;transform:translate(0);pointer-events:auto}.nav-links{list-style:none;display:flex;flex-direction:column;gap:0}.nav-item{overflow:hidden}.nav-item button{background:none;border:none;color:var(--text-secondary);font-family:var(--font-heading);font-size:.82rem;font-weight:400;letter-spacing:.18em;text-align:left;padding:.9rem 0;position:relative;transition:color var(--transition);text-transform:uppercase;width:100%}.nav-item button:hover{color:var(--text-active)}.nav-item.active button{color:var(--text-active);font-weight:500}.profile-counter{margin:auto 0;opacity:.4;transition:opacity var(--transition-fast)}.profile-counter:hover{opacity:.8}.view-counter{display:flex;flex-direction:column;align-items:flex-start;gap:.15rem}.view-counter-number{font-family:var(--font-heading);font-size:1.1rem;font-weight:500;letter-spacing:.05em;color:var(--text-secondary)}.view-counter-label{font-family:var(--font-heading);font-size:.6rem;font-weight:400;letter-spacing:.25em;text-transform:uppercase;color:var(--text-secondary)}.social-links{display:flex;flex-direction:column;gap:1.5rem;padding-bottom:3rem}.social-links a{color:var(--text-secondary);display:flex;align-items:center;transition:color var(--transition-fast),transform var(--transition-fast)}.social-links a:hover{color:#4dffe1;transform:translate(3px)}.fixed-left{display:flex;flex-direction:column;justify-content:center;padding:3rem 2.5rem;height:100vh;position:relative;opacity:0;transform:translateY(30px);transition:opacity .7s ease .35s,transform .7s ease .35s;pointer-events:none}.fixed-left.show{opacity:1;transform:translateY(0);pointer-events:auto}.hero-block{margin-bottom:2rem}.hero-name{font-family:var(--font-name);font-size:clamp(3.5rem,6vw,5.5rem);font-weight:500;letter-spacing:0;color:var(--text-primary);opacity:.85;line-height:1;margin-bottom:.6rem}.hero-subtitle{font-family:var(--font-body);font-size:1rem;font-weight:300;color:var(--text-secondary);letter-spacing:.02em;line-height:1.6}.hero-subtitle strong{color:var(--text-primary);font-weight:500}.about-block{margin-bottom:1.5rem}.contact-inquiry{position:absolute;bottom:3rem;color:var(--text-secondary);font-size:.88rem;font-weight:300;line-height:1.8}.contact-inquiry strong{font-weight:500}.contact-inquiry a{color:var(--text-primary);border-bottom:1px solid transparent;transition:border-color var(--transition-fast),color var(--transition-fast)}.contact-inquiry a:hover{color:var(--text-active);border-color:#4dffe1}.right-panel{height:100vh;position:relative;overflow:hidden;border-left:1px solid var(--border-color);opacity:0;transform:translate(30px);transition:opacity .7s ease .45s,transform .7s ease .45s;pointer-events:none}.right-panel.show{opacity:1;transform:translate(0);pointer-events:auto}.section-dots{position:absolute;right:2rem;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:.7rem;z-index:10}.dot{width:7px;height:7px;border-radius:50%;border:1px solid var(--text-secondary);background:transparent;padding:0;transition:all var(--transition)}.dot:hover{border-color:var(--text-active);transform:scale(1.4)}.dot.active{background:var(--text-active);border-color:var(--text-active)}.right-section{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;padding:4rem 4.5rem 4rem 3.5rem;transition:transform .7s cubic-bezier(.65,0,.35,1),opacity .7s cubic-bezier(.65,0,.35,1)}.right-section.active{transform:translateY(0);opacity:1;pointer-events:auto}.right-section.above{transform:translateY(-100%);opacity:0;pointer-events:none}.right-section.below{transform:translateY(100%);opacity:0;pointer-events:none}.right-section-inner{width:100%}.right-section-inner.scrollable-section{max-height:calc(100vh - 8rem);overflow-y:auto;padding-right:.5rem}.right-section.active .right-section-inner{animation:sectionFadeIn .5s ease .2s both}@keyframes sectionFadeIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.panel-title{font-family:var(--font-heading);font-size:.9rem;font-weight:500;letter-spacing:.2em;margin-bottom:1.2rem;text-transform:uppercase;color:var(--text-active)}.panel-divider{width:100%;height:1px;background:linear-gradient(to right,var(--border-hover),transparent 70%);margin-bottom:1.5rem}.bio-text{font-size:.95rem;font-weight:300;line-height:1.9;color:var(--text-secondary)}@media (max-width: 1100px){.page.layout-mode{grid-template-columns:110px 1fr 380px}.hero-name{font-size:clamp(2.8rem,5vw,4.5rem)}.right-section{padding:3rem 3.5rem 3rem 2.5rem}}@media (max-width: 800px){.hero-name-full{font-size:clamp(3rem,15vw,5rem)}.hero-content{max-width:100%;padding:2rem}.page.mobile-mode{display:flex;flex-direction:column;height:100dvh;overflow-y:scroll;scroll-behavior:smooth;scroll-snap-type:y proximity}.page.mobile-mode::-webkit-scrollbar{display:none}.page.mobile-mode{-ms-overflow-style:none;scrollbar-width:none}.mobile-nav{display:flex;justify-content:space-between;align-items:center;padding:1.5rem;position:sticky;top:0;z-index:100;background:#0a0a0ad9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border-color)}.nav-links-mobile{display:flex;gap:1.5rem}.social-links-mobile{display:flex;gap:1.25rem;align-items:center}.social-links-mobile a{color:var(--text-secondary);display:flex;align-items:center;transition:color .3s ease,transform .3s ease}.social-links-mobile a:active{color:var(--text-active);transform:scale(1.1)}.mobile-nav a{font-size:.85rem;letter-spacing:.2em;color:var(--text-secondary);font-weight:500}.mobile-nav a:hover,.mobile-nav a:active{color:var(--text-active)}.profile-counter-mobile{display:flex;align-items:center;opacity:.4}.profile-counter-mobile .view-counter{flex-direction:row;gap:.35rem;align-items:baseline}.profile-counter-mobile .view-counter-number{font-size:.8rem}.profile-counter-mobile .view-counter-label{font-size:.55rem}.mobile-content{display:flex;flex-direction:column;padding:0 1.5rem}.mobile-header.fixed-header{position:fixed;top:72px;left:0;right:0;z-index:90;background:linear-gradient(to bottom,var(--bg-main) 70%,transparent);padding:1rem 1.5rem 2rem;pointer-events:none}.mobile-header .hero-name{font-size:clamp(4.5rem,18vw,8rem);font-weight:500;letter-spacing:-.02em;opacity:.85;margin:0;animation:heroFadeIn 1s ease both}.mobile-section{scroll-snap-align:start;min-height:100dvh;display:flex;flex-direction:column;justify-content:flex-start;padding-bottom:4rem;padding-top:26vh;padding-left:0;padding-right:0}.mobile-section.home-section .hero-subtitle{font-size:1.25rem;font-weight:400;color:var(--text-secondary);margin-bottom:2rem;line-height:1.5}.mobile-section.home-section .section-label{font-size:1rem;font-weight:600;letter-spacing:.15em}.mobile-section.home-section .about-block{margin-bottom:2.5rem}.mobile-section.contact-section{min-height:50dvh;justify-content:center;align-items:center;text-align:center}.mobile-section.contact-section .contact-inquiry{margin:0}.page .right-section{display:none}[data-reveal]{opacity:0;transform:translateY(30px);transition:opacity .7s cubic-bezier(.25,.46,.45,.94),transform .7s cubic-bezier(.25,.46,.45,.94)}[data-reveal].revealed{opacity:1;transform:translateY(0)}.mobile-section.home-section .hero-subtitle[data-reveal]{transition-delay:.1s}.mobile-section.home-section .about-block[data-reveal]{transition-delay:.2s}.mobile-section.home-section .mobile-social-row[data-reveal]{transition-delay:.4s}.mobile-section.home-section .contact-inquiry[data-reveal]{transition-delay:.3s}.mobile-section .panel-title{font-size:1.4rem;font-weight:600;letter-spacing:.15em;margin-bottom:.8rem}.mobile-section .panel-divider{margin-bottom:1.5rem}.mobile-mode .project-card{transition:transform .2s ease,border-color .3s ease,box-shadow .3s ease}.mobile-mode .project-card:active{transform:scale(.97);border-color:#4dffe14d;box-shadow:0 0 20px #4dffe11a}}:root{--bg-main: #0a0a0a;--bg-surface: #111111;--text-active: #ffffff;--text-primary: #e8e5e1;--text-secondary: #8a8a8a;--border-color: #1e1e1e;--border-hover: #333333;--accent: #d4d0c8;--transition: .35s cubic-bezier(.25, .46, .45, .94);--transition-fast: .2s ease;--font-heading: "Space Grotesk", sans-serif;--font-body: "IBM Plex Sans", sans-serif;--font-name: "Outfit", sans-serif}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}body{font-family:var(--font-body);background-color:var(--bg-main);color:var(--text-primary);height:100vh;width:100vw;overflow:hidden;position:relative}body:before{content:"";position:fixed;top:-800px;left:-800px;width:1600px;height:1600px;background:radial-gradient(circle,rgba(0,225,255,.04) 0%,transparent 70%);pointer-events:none;z-index:0;transform:translate3d(var(--mouse-x, 50vw),var(--mouse-y, 50vh),0);will-change:transform}a{color:inherit;text-decoration:none;transition:var(--transition-fast)}a:hover{color:var(--text-active)}::selection{background-color:var(--accent);color:var(--bg-main)}::-webkit-scrollbar{width:3px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-hover);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}*{cursor:none!important}.cursor-canvas{position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:9997}.cursor-dot.neon{width:6px;height:6px;background:#4dffe1;border-radius:50%;position:fixed;top:0;left:0;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);box-shadow:0 0 6px #4dffe1,0 0 14px #1affd9,0 0 30px #00ffd54d}.cursor-ring.neon{width:32px;height:32px;border:1px solid hsla(170,100%,65%,.4);border-radius:50%;position:fixed;top:0;left:0;pointer-events:none;z-index:9998;transition:width .3s ease,height .3s ease,border-color .3s ease;transform:translate(-50%,-50%);box-shadow:0 0 8px #4dffe11a,inset 0 0 8px #4dffe10d}.cursor-ring.neon.hovering{width:50px;height:50px;border-color:#4dffe1b3;box-shadow:0 0 16px #4dffe133,inset 0 0 12px #4dffe11a}