*,*:before,*:after{box-sizing:border-box!important}html{color-scheme:dark;accent-color:var(--primary-base)}html,body{margin:0}html[data-theme=light]{color-scheme:light}body{-webkit-font-smoothing:antialiased;color:var(--text-normal);background-color:var(--background-base)}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6,code{overflow-wrap:anywhere}code{font-family:monospace}button{border:none;outline:none;background:none;padding:0}[data-theme=light],[data-theme=light] *{color-scheme:light}[data-theme=dark],[data-theme=dark] *{color-scheme:dark}:root{--background-base: hsl(0 0% 6%);--background-step-1: hsl(0 0% 8%);--background-step-2: hsl(0, 0%, 9%);--background-step-3: hsl(0, 0%, 12%);--background-gray: hsl(0 0% 50%);--text-normal: hsl(0 0% 100%);--text-dimmed: hsl(0 0% 100% / .8);--text-muted: hsl(0 0% 100% / .75);--text-inverted: hsl(0 0% 0%);--text-inverted-dimmed: hsl(0 0% 0% / .7);--text-inverted-muted: hsl(0 0% 0% / .65);--border: hsl(240 5% 17%);--shadow: hsl(0 0% 0% / .6);--default-base: hsl(0, 0%, 12%);--default-hover: hsl(0, 0%, 17%);--default-active: hsl(0, 0%, 14%);--primary-base: hsl(259, 60%, 71%);--primary-hover: hsl(259, 71%, 79%);--primary-active: hsl(259, 75%, 74%);--primary-vibrant: hsl(259, 75%, 74%);--success-base: hsl(142, 69%, 46%);--success-hover: hsl(142, 67%, 59%);--success-active: hsl(142, 84%, 55%);--warning-base: hsl(48, 92%, 55%);--warning-hover: hsl(48, 95%, 66%);--warning-active: hsl(48, 93%, 58%);--danger-base: hsl(339, 91%, 22%);--danger-hover: hsl(337, 90%, 27%);--danger-active: hsl(337, 90%, 25%);--danger-vibrant: hsl(339, 91%, 42%);--info-base: hsl(214, 96%, 22%);--info-hover: hsl(214, 92%, 26%);--info-active: hsl(214, 94%, 24%);--info-vibrant: hsl(214, 84%, 49%);--mono-base: hsl(0 0% 100%);--mono-hover: hsl(0 0% 90%);--mono-active: hsl(0 0% 95%);--text-light: hsl(0 0% 100%);--text-dark: hsl(0 0% 0%);--default-flat: hsl(0 0% 14% / .5);--default-flat-hover: hsl(0 0% 14% / .85);--default-flat-active: hsl(0 0% 14% / .75);--primary-flat: hsl(259 83% 73% / .1);--primary-flat-hover: hsl(259 83% 73% / .35);--primary-flat-active: hsl(259 83% 73% / .25);--success-flat: hsl(142 71% 46% / .1);--success-flat-hover: hsl(142 71% 46% / .35);--success-flat-active: hsl(142 71% 46% / .25);--warning-flat: hsl(48 96% 53% / .1);--warning-flat-hover: hsl(48 96% 53% / .35);--warning-flat-active: hsl(48 96% 53% / .25);--danger-flat: hsl(339 97% 31% / .1);--danger-flat-hover: hsl(339 97% 31% / .35);--danger-flat-active: hsl(339 97% 31% / .25);--info-flat: hsl(217 92% 52% / .1);--info-flat-hover: hsl(217 92% 52% / .35);--info-flat-active: hsl(217 92% 52% / .25);--mono-flat: hsl(0 0% 70% / .1);--mono-flat-hover: hsl(0 0% 70% / .35);--mono-flat-active: hsl(0 0% 70% / .25)}[data-theme=light]{--background-base: hsl(0 0% 97%);--background-step-1: hsl(0 0% 95%);--background-step-2: hsl(0 0% 92%);--background-step-3: hsl(0 0% 89%);--background-gray: hsl(0 0% 50%);--text-normal: hsl(0 0% 0%);--text-dimmed: hsl(0 0% 0% / .8);--text-muted: hsl(0 0% 0% / .75);--text-inverted: hsl(0 0% 100%);--text-inverted-dimmed: hsl(0 0% 100% / .85);--text-inverted-muted: hsl(0 0% 100% / .75);--border: hsl(263 5% 68%);--shadow: hsl(0 0% 65% / .6);--default-base: hsl(0, 0%, 82%);--default-hover: hsl(0, 0%, 91%);--default-active: hsl(0, 0%, 86%);--primary-base: hsl(259, 74%, 25%);--primary-hover: hsl(259, 76%, 35%);--primary-active: hsl(259, 76%, 32%);--primary-vibrant: hsl(259, 75%, 45%);--success-base: hsl(142, 60%, 44%);--success-hover: hsl(142, 60%, 55%);--success-active: hsl(142 60% 50%);--warning-base: hsl(48, 84%, 42%);--warning-hover: hsl(48, 85%, 49%);--warning-active: hsl(48, 86%, 45%);--danger-base: hsl(339, 93%, 15%);--danger-hover: hsl(337, 88%, 22%);--danger-active: hsl(337, 89%, 19%);--danger-vibrant: hsl(339, 86%, 38%);--info-base: hsl(214, 96%, 22%);--info-hover: hsl(214, 92%, 26%);--info-active: hsl(214, 94%, 24%);--info-vibrant: hsl(214, 88%, 39%);--mono-base: hsl(0 0% 10%);--mono-hover: hsl(0 0% 16%);--mono-active: hsl(0 0% 14%);--default-flat: hsl(0 0% 70% / .5);--default-flat-hover: hsl(0 0% 70% / .85);--default-flat-active: hsl(0 0% 70% / .75)}:root{--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-full: 999px}.sui-card{border:1px solid var(--border);background-color:var(--background-base);border-radius:var(--radius-md);width:fit-content;height:fit-content}.sui-card.filled{background-color:var(--background-step-3);border:none}.sui-card.full-w{width:100%}.sui-card.full-h{height:100%}.sui-card-header:has(*){padding:1rem 1rem 0rem;*{margin:0}}.sui-card-body{padding:1rem}.sui-card-footer:has(*){border-top:1px solid var(--border);padding:1rem}.sui-card-footer:not(:has(*)){display:none}.filled .sui-card-footer{border:none}@media screen and (max-width:840px){.sui-card{width:100%}}:root{--bg-color: #0f0f0f;--surface-color: #161616;--other-surface-color: #1a1a1a;--border-color: #222;--other-border-color: #2a2a2a;--text-color: #fff;--text-muted-color: #a1a1aa;--text-faint-color: #808080}@media(prefers-color-scheme:light){:root{--bg-color: #f5f5f5;--surface-color: #ffffff;--other-surface-color: #ebebeb;--border-color: #ddd;--other-border-color: #ccc;--text-color: #111111;--text-muted-color: #555555;--text-faint-color: #888888}}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:15px;line-height:1.6;background:var(--bg-color);color:var(--text-color);margin:0;padding:0}.main{min-height:100vh;width:100%;display:flex;align-items:center;justify-content:center;padding:16px}.card-grid{max-width:730px;width:100%;display:grid;gap:12px;grid-template-areas:"about" "projects" "skills" "links" "time" "footer";grid-template-columns:1fr}@media(min-width:480px){.card-grid{grid-template-areas:"about    about" "projects projects" "skills   links" "time     footer";grid-template-columns:1fr 1fr}}@media(min-width:730px){.card-grid{grid-template-areas:"about    about    projects" "skills   time    projects" "links     footer   footer";grid-template-columns:1fr 1fr 1fr}}.about-card{grid-area:about}.projects-card{grid-area:projects}.skills-card{grid-area:skills}.links-card{grid-area:links}.time-card{grid-area:time}.footer-card{grid-area:footer}.about{width:100%;height:100%;background-color:var(--bg-color)}.about-block{display:flex;flex-direction:row;align-items:center;gap:16px}.about-avatar{width:80px;height:80px;border-radius:50%;object-fit:cover;flex-shrink:0}.projects{width:100%;height:100%;background-color:var(--bg-color)}.projects-block{display:flex;flex-direction:column;gap:12px}.projects-in-block{width:100%;background-color:var(--other-surface-color);padding:12px!important;border-radius:8px!important}.projects-title-links{font-size:14px;line-height:1.6;color:var(--text-color);text-decoration:none;transition:color .2s ease}.projects-title-links:hover{color:var(--text-muted-color)}.projects-text{font-size:14px;color:var(--text-muted-color);margin:0;line-height:1.6}.skills{width:100%;height:100%;background-color:var(--bg-color)}.skills-span{display:flex;flex-wrap:wrap;gap:8px}.skills-badge{background:var(--other-surface-color)!important;color:var(--text-color)!important;padding:6px 12px!important;border-radius:8px!important;transition:background .2s ease!important}.skills-badge:hover{background:var(--border-color)!important}.links{width:100%;height:100%;background-color:var(--bg-color)}.links-block{display:flex;flex-wrap:wrap;gap:10px}.links-button{padding:10px 16px!important;border-radius:12px!important;border:1px solid var(--other-border-color)!important;background:var(--other-surface-color)!important;color:var(--text-color)!important}.links-button:hover{background:var(--border-color)!important;border-color:var(--text-muted-color)!important}.time{width:100%;height:100%;background-color:var(--bg-color)}#time-block{background:var(--other-surface-color);border-radius:12px;padding:16px}#date{color:var(--text-muted-color);font-size:15px;opacity:1;margin-bottom:3px}#clock{font-size:22px;font-weight:500;letter-spacing:.1em;transition:opacity .25s ease}.footer{width:100%;height:100%;background-color:var(--bg-color)}.footer-text{margin:0;padding:0;color:var(--text-muted-color);font-size:14px}.footer-block{display:flex;align-items:center;justify-content:space-between;color:var(--text-faint-color);border-top:1px solid var(--border-color);padding-top:12px;margin-top:12px}.footer-links{color:inherit;text-decoration:none;transition:color .2s ease}.footer-links:hover{color:var(--text-color)}.sui-badge{display:flex;flex-direction:row;gap:.5rem;align-items:center;padding:.125rem .75rem;border-radius:var(--radius-full);font-size:.875rem}.sui-badge.semi{border-radius:var(--radius-md)}.sui-badge.primary.flat,.sui-badge.primary.outlined{background-color:var(--primary-flat);color:var(--text-normal)}.sui-badge.primary.outlined{border:1px solid var(--primary-vibrant)}.sui-badge.success.flat,.sui-badge.success.outlined{background-color:var(--success-flat);color:var(--text-normal)}.sui-badge.success.outlined{border:1px solid var(--success-base)}.sui-badge.warning.flat,.sui-badge.warning.outlined{background-color:var(--warning-flat);color:var(--text-normal)}.sui-badge.warning.outlined{border:1px solid var(--warning-base)}.sui-badge.danger.flat,.sui-badge.danger.outlined{background-color:var(--danger-flat);color:var(--text-normal)}.sui-badge.danger.outlined{border:1px solid var(--danger-vibrant)}.sui-badge.info.flat,.sui-badge.info.outlined{background-color:var(--info-flat);color:var(--text-normal)}.sui-badge.info.outlined{border:1px solid var(--info-vibrant)}.sui-badge.mono.flat,.sui-badge.mono.outlined{background-color:var(--mono-flat);color:var(--text-normal)}.sui-badge.mono.outlined{border:1px solid var(--mono-base)}.sui-badge.sm{padding:.125rem .75rem}.sui-badge.sm{font-size:.75rem}.sui-badge.sm>svg{width:14px;height:14px}.sui-badge.lg{font-size:1rem;padding:.25rem 1rem}.sui-badge.lg{font-size:1rem}.sui-badge.lg>svg{width:20px;height:20px}.sui-button{display:flex;flex-direction:row;align-items:center;text-align:center;position:relative;gap:.5rem;outline:none;border:none;font-weight:400;border-radius:var(--radius-md);transition:transform .15s,background-color .15s,border-color .15s,color .15s;transition-timing-function:ease;cursor:pointer;background-color:var(--default-base);border-color:var(--border);color:var(--text-normal);min-width:fit-content;will-change:transform;text-decoration:none}.sui-button.disabled{pointer-events:none;opacity:.5}.sui-button.outlined{border-width:1px;border-style:solid}.sui-button.outlined:hover,.sui-button.outlined:active,.sui-button:hover{background-color:var(--default-hover)}.sui-button:active{background-color:var(--default-active);transform:scale(.95)}.sui-button.flat{background:var(--default-flat)}.sui-button.flat:hover{background:var(--default-flat-hover)}.sui-button.flat:active{background:var(--default-flat-active)}.sui-button.sm{height:32px;padding:.5rem .75rem;font-size:.825em}.sui-button.md{height:40px;padding:.5rem .75rem;font-size:.875em}.sui-button.lg{height:48px;padding:.75rem 1rem;font-size:1em}.sui-button:focus-visible{outline:2px solid var(--text-normal);outline-offset:2px}.sui-button.primary{background-color:var(--primary-base);border-color:var(--primary-base);color:var(--text-inverted)}.sui-button.primary:hover{background-color:var(--primary-hover)}.sui-button.primary:active{background-color:var(--primary-active)}.sui-button.primary.outlined{background-color:var(--default-base);color:var(--text-normal)}.sui-button.primary.outlined:hover{background-color:var(--default-hover)}.sui-button.primary.outlined:active{background-color:var(--default-active)}.sui-button.primary.flat{background-color:var(--primary-flat);color:#b796fd}.sui-button.primary.flat:hover{background-color:var(--primary-flat-hover)}.sui-button.primary.flat:active{background-color:var(--primary-flat-active)}.sui-button.success{background-color:var(--success-base);border-color:var(--success-base);color:var(--text-dark)}.sui-button.success:hover{background-color:var(--success-hover)}.sui-button.success:active{background-color:var(--success-active)}.sui-button.success.outlined{background-color:var(--default-base);color:var(--text-normal)}.sui-button.success.outlined:hover{background-color:var(--default-hover)}.sui-button.success.outlined:active{background-color:var(--default-active)}.sui-button.success.flat{background-color:var(--success-flat);color:var(--success-base)}.sui-button.success.flat:hover{background-color:var(--success-flat-hover)}.sui-button.success.flat:active{background-color:var(--success-flat-active)}.sui-button.warning{background-color:var(--warning-base);border-color:var(--warning-base);color:var(--text-dark)}.sui-button.warning:hover{background-color:var(--warning-hover)}.sui-button.warning:active{background-color:var(--warning-active)}.sui-button.warning.outlined{background-color:var(--default-base);color:var(--text-normal)}.sui-button.warning.outlined:hover{background-color:var(--default-hover)}.sui-button.warning.outlined:active{background-color:var(--default-active)}.sui-button.warning.flat{background-color:var(--warning-flat);color:var(--warning-base)}.sui-button.warning.flat:hover{background-color:var(--warning-flat-hover)}.sui-button.warning.flat:active{background-color:var(--warning-flat-active)}.sui-button.danger{background-color:var(--danger-base);border-color:var(--danger-base);color:var(--text-light)}.sui-button.danger:hover{background-color:var(--danger-hover)}.sui-button.danger:active{background-color:var(--danger-active)}.sui-button.danger.outlined{background-color:var(--default-base);color:var(--text-normal)}.sui-button.danger.outlined:hover{background-color:var(--default-hover)}.sui-button.danger.outlined:active{background-color:var(--default-active)}.sui-button.danger.flat{background-color:var(--danger-flat);color:#f971a5}.sui-button.danger.flat:hover{background-color:var(--danger-flat-hover)}.sui-button.danger.flat:active{background-color:var(--danger-flat-active)}.sui-button.info{background-color:var(--info-base);border-color:var(--info-base);color:var(--text-light)}.sui-button.info:hover{background-color:var(--info-hover)}.sui-button.info:active{background-color:var(--info-active)}.sui-button.info.outlined{background-color:var(--default-base);color:var(--text-normal)}.sui-button.info.outlined:hover{background-color:var(--default-hover)}.sui-button.info.outlined:active{background-color:var(--default-active)}.sui-button.info.flat{background-color:var(--info-flat);color:var(--info-base)}.sui-button.info.flat:hover{background-color:var(--info-flat-hover)}.sui-button.info.flat:active{background-color:var(--info-flat-active)}.sui-button.mono{background-color:var(--mono-base);border-color:var(--mono-base);color:var(--text-inverted)}.sui-button.mono:hover{background-color:var(--mono-hover)}.sui-button.mono:active{background-color:var(--mono-active)}.sui-button.mono.outlined{background-color:var(--default-base);color:var(--text-normal)}.sui-button.mono.outlined:hover{background-color:var(--default-hover)}.sui-button.mono.outlined:active{background-color:var(--default-active)}.sui-button.mono.flat{background-color:var(--mono-flat);color:var(--mono-base)}.sui-button.mono.flat:hover{background-color:var(--mono-flat-hover)}.sui-button.mono.flat:active{background-color:var(--mono-flat-active)}.sui-button.full{width:100%;justify-content:center}[data-theme=light]{.sui-button.primary.flat{color:#4f12d3}.sui-button.success.flat{background-color:var(--success-flat);color:#15512c}.sui-button.success.flat:hover{background-color:var(--success-flat-hover)}.sui-button.success.flat:active{background-color:var(--success-flat-active)}.sui-button.warning.flat{background-color:var(--warning-flat);color:#5b4b0b}.sui-button.warning.flat:hover{background-color:var(--warning-flat-hover)}.sui-button.warning.flat:active{background-color:var(--warning-flat-active)}.sui-button.danger.flat{color:#920234}}