:root{--color-bg-base: #f5f5f7;--color-bg-elevated: #f4f2f8;--color-bg-hero: radial-gradient( circle at 0% 0%, #e3ddff 0, #f5f5f7 45%, #fdfcfe 100% );--color-bg-section-soft: linear-gradient( 135deg, #f5f5f7 0%, #f0eef9 40%, #f8f6ff 100% );--color-bg-section-plain: #f5f5f7;--color-bg-contact: radial-gradient(at 47% 33%, #e3ddff 0%, transparent 59%), radial-gradient(at 82% 65%, #f0eef9 0%, transparent 55%);--color-text-primary: #1f2127;--color-text-secondary: #17181b;--color-text-muted: #292d41;--color-text-on-dark: #17181b;--color-text-on-glass: #151621;--color-accent: #252a4a;--color-accent-soft: #6b72b5;--color-accent-subtle: rgba(107, 114, 181, .15);--color-border-subtle: rgba(19, 23, 41, .12);--color-border-strong: rgba(19, 23, 41, .24);--color-surface-glass: rgba(255, 255, 255, .76);--color-surface-glass-alt: rgba(255, 255, 255, .9);--color-surface-glass-border: rgba(255, 255, 255, .6);--color-surface-glass-soft-border: rgba(255, 255, 255, .35);--color-focus-ring: #6b72b5;--color-link: #252a4a;--color-link-hover: #6b72b5;--radius-pill: 9999px;--radius-sm: 12px;--radius-md: 16px;--radius-lg: 20px;--radius-xl: 24px;--shadow-soft: 0 18px 45px rgba(15, 18, 35, .12);--shadow-softer: 0 24px 60px rgba(10, 12, 30, .14);--shadow-subtle: 0 10px 30px rgba(10, 12, 25, .08);--space-2: .125rem;--space-4: .25rem;--space-6: .375rem;--space-8: .5rem;--space-10: .625rem;--space-12: .75rem;--space-16: 1rem;--space-18: 1.125rem;--space-20: 1.25rem;--space-24: 1.5rem;--space-32: 2rem;--space-40: 2.5rem;--space-48: 3rem;--space-64: 4rem;--space-80: 5rem;--font-sans: system-ui, -apple-system, BlinkMacSystemFont, "DM Sans", "Segoe UI", sans-serif;--font-serif: "Playfair Display", "Georgia", serif;--font-mono: "JetBrains Mono", "Fira Code", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--motion-ease-standard: cubic-bezier(.22, .61, .36, 1);--motion-duration-fast: .16s;--motion-duration-med: .22s;--motion-duration-slow: .36s;--glass-blur: 18px;--glass-saturate: 1.3;--layout-max-width: 1120px;--layout-gutter: 1.5rem;--color-bg-hero: radial-gradient(at 47% 33%, #e3ddff 0%, transparent 59%), radial-gradient(at 82% 65%, #f0eef9 0%, transparent 55%);--hero-bg-color: #f5f5f7;--glass-inset-bg: rgba(255, 255, 255, .45);--glass-inset-bg-menu: rgba(255, 255, 255, .95);--glass-inset-border: rgba(19, 23, 41, .08);--glass-inset-shadow-dark: inset 4px 4px 10px rgba(160, 165, 190, .35);--glass-inset-shadow-light: inset -3px -3px 8px rgba(255, 255, 255, .8);--glass-inset-shadow-depth: inset 1px 1px 2px rgba(100, 110, 140, .1);--text-shadow-glass: 0 1px 0 rgba(255, 255, 255, .5);--nm-bg: #e0e5ec;--nm-shadow-light: rgba(255, 255, 255, .9);--nm-shadow-dark: rgba(163, 177, 198, .6);--box-shado-nm: -6px -6px 12px -1px var(--nm-shadow-light), 8px 8px 12px -2px var(--nm-shadow-dark);--chip-skill-box-shadow: 9px 9px 16px rgb(163, 177, 198, .6), -9px -9px 16px rgba(255, 255, 255, .5);--slider-btn-bg: rgba(255, 255, 255, .8);--slider-btn-border: rgba(161, 161, 161, .37);--slider-btn-border-hover: rgba(100, 100, 100, .37);--arrow-color: #17181b;--cat-btn-border: rgba(255, 255, 255, .18);--cat-btn-bg: radial-gradient( circle at top left, rgba(255, 255, 255, .9), transparent 55% ), rgba(255, 255, 255, .9);--cat-btn-shadow: 0 10px 30px rgba(10, 12, 25, .08);--cat-btn-shadow-hover: 0 10px 30px rgba(10, 12, 25, .253);--cat-btn-border: 1px solid rgba(255, 255, 255, .18);--cat-btn-bg-highlight-active: rgba(255, 255, 255, .32);--cat-btn-bg-base-active: rgba(15, 16, 32, .75);--cat-btn-shadow-main: 0 10px 30px rgba(0, 0, 0, .32);--cat-btn-shadow-outline: 0 0 0 1px rgba(255, 255, 255, .04);--cat-btn-icon-bg: rgba(5, 7, 20, .7);--cat-btn-icon-outline: rgba(255, 255, 255, .06);--cat-btn-text: #1f2127;--cat-color-head: #f5b563;--cat-color-ear: #707070;--cat-color-eye: #5a5959;--cat-color-eye-highlight: #fff;--cat-color-eye-shadow: rgb(120, 120, 121);--cat-color-nose: #f35c73;--cat-head-shadow-dark: rgba(0, 0, 0, .12);--cat-head-shadow-light: rgba(255, 255, 255, .15);--cat-head-line: rgba(0, 0, 0, .18);--footer-color: #050510;--footer-bg: rgba(220, 221, 245, .932);--theme-toggle-bg: linear-gradient( 135deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .03) );--theme-toggle-border: rgba(255, 255, 255, .12);--theme-toggle-shadow: 0 18px 40px rgba(0, 0, 0, .45);--theme-toggle-icon-color: var(--color-accent);--theme-toggle-shadow-hover: 0 20px 44px rgba(0, 0, 0, .644);--nav-bg: linear-gradient( to bottom, rgba(245, 245, 247, .9), rgba(245, 245, 247, .75), rgba(245, 245, 247, .4) );--nav-border: rgba(255, 255, 255, .9);--nav-shadow: 0 1px 0 rgba(15, 18, 35, .03);--nav-mobile-bg: linear-gradient( 165deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .03) );--nav-mobile-border: rgba(255, 255, 255, .1);--nav-link-hover-bg: rgba(107, 114, 181, .12);--nav-burger-bg: linear-gradient( 135deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .03) );--nav-burger-border: rgba(255, 255, 255, .12);--nav-burger-shadow: 0 18px 40px rgba(0, 0, 0, .45);--modal-backdrop-bg: radial-gradient(circle at top, rgba(0, 0, 0, .6), transparent 55%), rgba(0, 0, 0, .55);--modal-bg: var(--color-surface-glass-alt);--modal-border: var(--color-surface-glass-border);--modal-shadow: var(--shadow-softer);--modal-text: var(--color-text-on-glass);--modal-divider: rgba(255, 255, 255, .16);--modal-close-icon: var(--color-text-on-glass);--modal-paw-shadow: rgba(0, 0, 0, .2);--about-card-bg: var(--color-bg-elevated);--about-card-border: rgba(255, 255, 255, .7);--about-card-shadow: var(--shadow-subtle);--about-timeline-line: linear-gradient( to bottom, rgba(107, 114, 181, .6), rgba(107, 114, 181, .05) );--about-timeline-dot: var(--color-accent-soft);--about-timeline-dot-ring: rgba(107, 114, 181, .2);--about-timeline-dot-ring-pulse: rgba(107, 114, 181, .1);--contact-card-bg: rgba(11, 13, 23, .7);--contact-card-border: rgba(255, 255, 255, .16);--contact-card-shadow: 0 12px 35px rgba(0, 0, 0, .7);--contact-link-icon: var(--color-accent-soft);--contact-link-arrow: var(--color-text-muted);--contact-link-label: var(--color-text-primary);--contact-link-text: var(--color-text-muted);--timeline-divider: rgba(255, 255, 255, .7);--timeline-period: var(--color-text-muted);--timeline-role: var(--color-text-secondary);--timeline-bullet: var(--color-text-secondary);--hero-mesh-gradient: linear-gradient( 135deg, rgba(107, 114, 181, .16), transparent 40%, rgba(255, 255, 255, .5) );--hero-mesh-grid-x: linear-gradient( to right, rgba(255, 255, 255, .1) 1px, transparent 1px );--hero-mesh-grid-y: linear-gradient( to bottom, rgba(255, 255, 255, .1) 1px, transparent 1px );--hero-mesh-opacity: .45;--btn-primary-bg: linear-gradient(135deg, #252a4a, #6b72b5);--btn-primary-text: #ffffff;--btn-primary-shadow: 0 14px 30px rgba(20, 23, 52, .4);--btn-primary-shadow-hover: 0 18px 40px rgba(20, 23, 52, .5);--btn-primary-highlight: linear-gradient( 120deg, rgba(255, 255, 255, .3), transparent 40%, transparent );--btn-ghost-border: rgba(37, 42, 74, .25);--btn-ghost-hover-bg: rgba(255, 255, 255, .9);--quickfacts-divider: rgba(255, 255, 255, .18);--personal-modal-backdrop: radial-gradient(circle at top, rgba(0, 0, 0, .7), transparent 55%), rgba(0, 0, 0, .65);--personal-modal-bg: rgba(8, 10, 24, .96);--personal-modal-border: rgba(255, 255, 255, .16);--personal-modal-shadow: 0 24px 80px rgba(0, 0, 0, .85), 0 0 0 1px rgba(255, 255, 255, .04);--personal-modal-close-bg: rgba(255, 255, 255, .06);--personal-modal-close-hover-bg: rgba(255, 255, 255, .12);--personal-notes-divider: rgba(255, 255, 255, .12);--work-card-bg: radial-gradient( circle at 0% 0%, rgba(255, 255, 255, .96), rgba(244, 244, 251, .96) );--work-card-border: rgba(255, 255, 255, .7);--work-card-shadow: var(--shadow-soft);--work-preview-bg: linear-gradient( 135deg, rgba(107, 114, 181, .12), rgba(37, 42, 74, .65) );--work-preview-surface-bg: rgba(255, 255, 255, .95);--work-preview-surface-shadow: 0 16px 40px rgba(10, 12, 30, .26);--work-bar-bg: rgba(37, 42, 74, .12);--work-bar-accent: linear-gradient(135deg, #252a4a, #6b72b5);--work-tag-bg: rgba(107, 114, 181, .06);--work-tag-border: rgba(107, 114, 181, .3);--work-tag-text: var(--color-text-secondary);--work-cta-color: var(--color-accent)}[data-theme=dark]{--color-bg-base: #050511;--color-bg-elevated: #09091a;--color-bg-hero: radial-gradient( circle at 0% 0%, #252a4a 0, #050511 50%, #020309 100% );--color-bg-section-soft: linear-gradient( 135deg, #050511 0%, #101123 40%, #050511 100% );--color-bg-section-plain: #050511;--color-bg-contact: radial-gradient( circle at 0% 0%, #050511 0, #020206 50%, #000000 100% );--color-text-primary: #f6f6f8;--color-text-secondary: #dadefd;--color-text-muted: #d0d3f3;--color-text-on-dark: #f8f8ff;--color-text-on-glass: #f6f6ff;--color-accent: #8d93ff;--color-accent-soft: #6b72ff;--color-accent-subtle: rgba(107, 114, 255, .2);--color-border-subtle: rgba(255, 255, 255, .06);--color-border-strong: rgba(255, 255, 255, .14);--color-surface-glass: rgba(11, 13, 23, .7);--color-surface-glass-alt: rgba(15, 18, 35, .9);--color-surface-glass-border: rgba(255, 255, 255, .3);--color-surface-glass-soft-border: rgba(255, 255, 255, .18);--color-focus-ring: #8d93ff;--color-link: #d0d3ff;--color-link-hover: #ffffff;--shadow-soft: 0 18px 45px rgba(0, 0, 0, .5);--shadow-softer: 0 24px 60px rgba(0, 0, 0, .65);--shadow-subtle: 0 10px 30px rgba(0, 0, 0, .4);--color-bg-hero: radial-gradient(at 47% 33%, hsl(202, 96%, 19%) 0%, transparent 59%), radial-gradient(at 82% 65%, hsl(218, 39%, 11%) 0%, transparent 55%);--hero-bg-color: #1a1b1c;--glass-inset-bg: rgba(255, 255, 255, .03);--glass-inset-bg-menu: rgba(5, 7, 17, .95);--glass-inset-border: rgba(255, 255, 255, .05);--glass-inset-shadow-dark: inset 5px 5px 12px rgba(0, 0, 0, .5);--glass-inset-shadow-light: inset -2px -2px 6px rgba(255, 255, 255, .06);--glass-inset-shadow-depth: inset 1px 1px 3px rgba(0, 0, 0, .3);--nm-bg: #2d343f;--nm-shadow-light: rgba(78, 80, 84, .178);--nm-shadow-dark: rgba(0, 0, 0, .8);--box-shado-nm: -10px -12px 31px 0px var(--nm-shadow-light), 8px 8px 12px -2px var(--nm-shadow-dark);--chip-skill-box-shadow: 9px 9px 16px #050510, -9px -9px 16px #252a4a61;--slider-btn-bg: rgba(11, 13, 23, .8);--slider-btn-border: rgba(255, 255, 255, .18);--slider-btn-border-hover: rgba(136, 136, 136, .37);--arrow-color: #f6f6ff;--cat-btn-border: var(--color-border-subtle);--cat-btn-text: #1f2127;--footer-color: rgba(220, 221, 245, .932);--footer-bg: #050510;--nav-bg: linear-gradient( to bottom, rgba(5, 5, 17, .96), rgba(5, 5, 17, .9), rgba(5, 5, 17, .85) );--nav-border: rgba(255, 255, 255, .08);--nav-shadow: 0 1px 0 rgba(0, 0, 0, .6);--work-card-bg: radial-gradient(circle at 0% 0%, #17182c 0, #050511 60%);--work-card-border: rgba(255, 255, 255, .08);--work-preview-bg: linear-gradient( 135deg, rgba(107, 114, 255, .12), rgba(10, 12, 24, .8) );--work-preview-surface-bg: rgba(15, 18, 35, .9);--work-preview-surface-shadow: 0 16px 40px rgba(0, 0, 0, .65);--work-bar-bg: rgba(255, 255, 255, .12);--work-bar-accent: linear-gradient(135deg, #8d93ff, #6b72ff);--work-tag-bg: rgba(141, 147, 255, .12);--work-tag-border: rgba(141, 147, 255, .3);--work-cta-color: var(--color-accent)}*,*:before,*:after{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;font-family:var(--font-sans);font-size:var(--text-base);line-height:1.6;color:var(--color-text-primary);background:var(--color-bg-base);-webkit-font-smoothing:antialiased}img{max-width:100%;display:block}a{color:var(--color-link);text-decoration:none}a:hover{color:var(--color-link-hover)}button{font-family:inherit}:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:3px}@media (prefers-reduced-motion: reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.layout-container{max-width:var(--layout-max-width);margin-inline:auto;padding-inline:var(--layout-gutter)}.section-label{font-family:var(--font-mono);font-size:1.2rem;letter-spacing:.18em;text-transform:uppercase;color:var(--color-text-muted);margin-bottom:var(--space-16)}.homepage{background:radial-gradient(circle at 0% 0%,#e3ddff 0,#f5f5f7 40% 100%)}[data-theme=dark] .homepage{background:var(--color-bg-hero)}.sr-only:not(:focus):not(:active){clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}