@import"https://fonts.googleapis.com/css2?family=Source+Code+Pro:wght@400;500;600&display=swap";canvas{position:fixed;top:0;left:0;z-index:0}:root{--dark-bg: rgba(15, 15, 20, .95);--highlight: #61dafb;--spacing: 350px;--keyword: #569cd6;--string: #ce9178;--comment: #6a9955;--number: #b5cea8;--boolean: #569cd6;--property: #9cdcfe;--this: #c586c0;font-family:Source Code Pro,monospace;font-weight:400}main{width:100vw;color:#d4d4d4;z-index:99;position:absolute;margin:0 auto;padding:120px 0;display:grid;grid-template-columns:repeat(12,1fr);line-height:1.6}h1,h2,h3,blockquote{font-family:Source Code Pro,monospace;font-weight:500;color:var(--highlight)}header{background:var(--dark-bg);grid-column:2 / span 5;font-size:2rem;padding:2rem;margin-bottom:var(--spacing);border-radius:4px;border-left:4px solid var(--highlight)}.subtitle{color:#888;font-size:1rem;margin-top:.5rem}section{grid-column:2 / 8;padding:1.5rem;background:var(--dark-bg);font-size:1rem;margin-bottom:var(--spacing);border-radius:4px;border-left:4px solid var(--highlight)}blockquote{grid-column:2 / 8;background:#1e1e28b3;padding:1.2rem;margin:2rem 0;border-left:4px solid var(--highlight);font-style:normal;border-radius:4px}button{background:#282832e6;color:var(--highlight);border:1px solid var(--highlight);padding:.8rem 1.2rem;margin:.5rem 0;border-radius:4px;cursor:pointer;font-size:.9rem;font-family:Source Code Pro,monospace;transition:all .3s}button:hover{background:var(--highlight);color:#1e1e1e}.keyword{color:var(--keyword)}.string{color:var(--string)}.comment{color:var(--comment)}.number{color:var(--number)}.boolean{color:var(--boolean)}.property{color:var(--property)}.this{color:var(--this)}.console-prompt{color:var(--highlight);margin-right:.5rem}.blinking-cursor{animation:blink 1s step-end infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.project{margin-bottom:2rem;background:#1e1e2880;padding:1rem;border-radius:4px}.code-list{list-style-type:none;padding-left:1rem}.code-list li{position:relative;padding-left:1.5rem}.code-list li:before{content:"•";color:var(--highlight);position:absolute;left:0}@media (max-width: 768px){main{display:block;padding:60px 1rem}header,section,blockquote{grid-column:1 / -1;margin-bottom:2rem;padding:1rem;font-size:1rem}header{font-size:1.5rem}.subtitle{font-size:.9rem}button{width:100%;font-size:1rem}img{max-width:100%;height:auto}}