#app{max-width:600px;margin:0 auto;padding:2rem;gap:1.5em;display:flex;flex-direction:column}.container{display:flex;align-items:center;justify-content:center;flex-direction:column;height:100dvh;gap:3em}.container-title{display:flex;justify-content:center;flex-direction:column;align-items:center}.grid{display:grid;grid-template-columns:repeat(4,minmax(100px,1fr));grid-template-rows:repeat(6,minmax(100px,1fr));grid-gap:2em;grid-template-areas:"telegram   telegram    github      github" "telegram   telegram    github      github" "wall       wall        projects    projects" "vk         soundcloud  steam       steam" "contact    contact     sources     sources" "back       back        sources     sources"}.item{position:relative;color:#fff;border-radius:24px;outline:1px solid var(--border);display:flex;justify-content:center;align-items:center;overflow:hidden;transition:outline-color .2s ease}.item:hover{outline-color:var(--accent-border)}.item-telegram{grid-area:telegram}.item-github{grid-area:github}.item-wall{grid-area:wall}.item-projects{grid-area:projects}.item-vk{grid-area:vk}.item-soundcloud{grid-area:soundcloud}.item-steam{grid-area:steam}.item-contact{grid-area:contact}.item-sources{grid-area:sources}.item-back{grid-area:back}.item:hover .item-image{filter:blur(4px);transform:scale(1.05)}.item-image{position:absolute;top:0;left:0;right:0;bottom:0;border-radius:24px;background-size:cover;background-position:center;background-color:#0009;opacity:.4;z-index:1;transition:filter .2s ease-in-out,transform .2s ease-in-out;transition-delay:.1s}.item-icon{position:absolute;top:10px;left:10px;z-index:2}.item-icon svg,.item-icon-centered svg{width:2rem;height:2rem}.item-icon-centered{display:flex;justify-content:center;align-items:center;z-index:2}.item-text{position:absolute;bottom:10px;right:12px;z-index:2;display:flex;flex-direction:column;text-align:right}.item-text-description{font-size:.7rem;color:#fff9}.item-icon,.item-text{transition:transform .3s ease;transition-delay:.1s}.item:hover .item-icon{transform:translate(20%,20%) scale(1.2)}.item:hover .item-text{transform:translate(-20%,-20%) scale(1.2)}.text-small{font-size:.8em}@media (max-width: 640px){#app{padding:1rem}.container{gap:1em}.grid{grid-template-columns:repeat(4,minmax(60px,1fr));grid-template-rows:repeat(6,minmax(60px,1fr));grid-gap:1em}.item-text-description{display:none}.item,.item-image{border-radius:16px}.item-icon svg,.item-icon-centered svg{width:1.5rem;height:1.5rem}}@font-face{font-family:Cascadia Code;src:url(/CascadiaCode.woff2) format("woff2");font-style:normal;font-display:swap}@font-face{font-family:Cascadia Code;src:url(/CascadiaCodeItalic.woff2) format("woff2");font-style:italic;font-display:swap}:root{--bg: #0b0b0f;--bg-raised: #16161e;--border: rgb(255 255 255 / .08);--text: rgba(255, 255, 255, .87);--accent: #a78bfa;--accent-2: #22d3ee;--accent-border: rgb(167 139 250 / .4);font-family:Cascadia Code,Courier New,Courier,monospace;line-height:1.5;font-weight:400;color-scheme:dark;color:var(--text);background-color:var(--bg);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}svg{display:block}*{margin:0}body{display:flex;justify-content:flex-start;min-width:320px;min-height:100vh;background-color:var(--bg)}
