:root{--accent: #1e88e5;--bg: #ffffff;--text: #10141D;--card-bg: #ffffff;--card-border: rgba(16,20,29,.06);--panel-bg: color-mix(in srgb, var(--card-bg) 90%, transparent);--panel-border: var(--card-border);--panel-shadow: 0 6px 18px rgba(2,6,23,.06);--panel-hover-border: color-mix(in srgb, var(--accent) 70%, transparent);--panel-hover-shadow: 0 0 12px color-mix(in srgb, var(--accent) 40%, transparent);--code-text: var(--text);--code-muted: rgba(16,20,29,.6);--icon-filter: none}.dark{--accent: #7B00FF;--bg: #0b0f15;--text: #ffffff;--card-bg: #07101a;--card-border: rgba(255,255,255,.06);--panel-bg: color-mix(in srgb, var(--card-bg) 92%, transparent);--panel-border: rgba(255,255,255,.04);--panel-shadow: 0 6px 20px rgba(2,6,23,.45);--panel-hover-border: color-mix(in srgb, var(--accent) 70%, transparent);--panel-hover-shadow: 0 0 14px color-mix(in srgb, var(--accent) 36%, transparent);--code-text: var(--text);--code-muted: rgba(255,255,255,.6);--icon-filter: none}.dark .img.white-icon,.dark .imgBx img.white-icon{filter:invert(1) brightness(1.6) saturate(1.1)}*,*:before,*:after{box-sizing:border-box}html,body{overflow-x:hidden;margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:Segoe UI,sans-serif}*{transition:color .18s ease,background-color .18s ease,border-color .18s ease,box-shadow .18s ease,filter .18s ease}.compentence-root{background-image:url(/color_splash_skills.svg);background-repeat:no-repeat;background-size:cover;background-position:center;color:var(--text)}.dark,.dark body,.dark a,.dark a *,.dark button,.dark button *,.dark h1,.dark h2,.dark h3,.dark h4,.dark h5,.dark h6,.dark p,.dark span,.dark li{color:var(--text)!important}svg{display:inline-block;vertical-align:middle;width:32px;height:32px;fill:currentColor;stroke:currentColor}.dark svg{color:var(--text)!important;fill:currentColor!important;stroke:currentColor!important}.imgBx img{display:block;width:32px;height:32px;object-fit:contain;filter:var(--icon-filter);transition:filter .18s ease}.icon{width:32px;height:32px;display:inline-block;color:var(--text)}.card,.menu,.panel,.theme-dialog{background:var(--panel-bg);border:1px solid var(--panel-border);box-shadow:var(--panel-shadow);border-radius:12px;padding:1rem;transition:all .18s ease}.dark .card,.dark .menu,.dark .panel,.dark .theme-dialog{background:var(--panel-bg)!important;border-color:var(--panel-border)!important;box-shadow:var(--panel-shadow)!important}.card:hover,.panel:hover{border-color:var(--panel-hover-border);box-shadow:var(--panel-hover-shadow)}:root:not(.dark) .compentence-root .imgBx img{filter:none;transition:filter .35s ease,transform .35s ease}:root:not(.dark) .compentence-root .imgBx img.animated{animation:iconAccentPulse 3s ease-in-out infinite}:root:not(.dark) .compentence-root .skill,:root:not(.dark) .compentence-root .center-label,:root:not(.dark) .compentence-root .label{transition:color .35s ease,text-shadow .35s ease}:root:not(.dark) .compentence-root .skill.animated,:root:not(.dark) .compentence-root .center-label.animated,:root:not(.dark) .compentence-root .label.animated{animation:textAccentPulse 3.5s ease-in-out infinite}@keyframes iconAccentPulse{0%{filter:drop-shadow(0 0 0 rgba(0,0,0,0));transform:scale(1)}25%{filter:drop-shadow(0 3px 8px color-mix(in srgb,var(--accent) 30%,transparent));transform:scale(1.06)}50%{filter:drop-shadow(0 6px 18px color-mix(in srgb,var(--accent) 45%,transparent));transform:scale(1.12)}75%{filter:drop-shadow(0 3px 8px color-mix(in srgb,var(--accent) 30%,transparent));transform:scale(1.06)}to{filter:drop-shadow(0 0 0 rgba(0,0,0,0));transform:scale(1)}}@keyframes textAccentPulse{0%{color:var(--text);text-shadow:none}40%{color:color-mix(in srgb,var(--accent) 55%,var(--text) 45%);text-shadow:0 6px 18px color-mix(in srgb,var(--accent) 16%,transparent)}to{color:var(--text);text-shadow:none}}:root:not(.dark) .compentence-root .imgBx:hover .img.animated{animation-duration:1.6s;transform:scale(1.18)!important}:root:not(.dark) .compentence-root .outer-circle:hover .center-label.animated,:root:not(.dark) .compentence-root .outer-circle:hover .label.animated{animation-duration:1.8s}:root:not(.dark) .compentence-root .imgBx.white-bubble{background:color-mix(in srgb,white 88%,var(--accent) 12%)!important;border-color:color-mix(in srgb,var(--panel-border) 60%,var(--accent) 10%)!important;box-shadow:0 6px 18px color-mix(in srgb,var(--accent) 6%,transparent)!important}:root:not(.dark) .compentence-root .imgBx.white-bubble img{filter:invert(1) grayscale(1) contrast(1.15)!important}
