body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*{--charcoal: #36454f;--button-grey: #efefef;--black: black;--pretty-black: #1a1b1f;--grey: #8a8a8a;--pretty-blue: #89badf;--pretty-blue-lighter: #94c0e2;--pretty-blue-light: #9ec6e4;--pretty-purple: #7297d6;--pretty-purple-light: #80a1da;--pretty-purple-dark: #4979ca;--pretty-orange: #eca9a9;--pretty-pink: #d399e7;--pretty-green: #d1e3bc;--pretty-green-darker: #bccca9;--space-blue: #142c8f;--primary-background-color: antiquewhite;--basic-box-shadow: rgba(0, 0, 0, .1) 0px 2px 4px;font-family:monospace;color:var(--pretty-black);--shadow-color: 24deg 28% 44%;--shadow-elevation-low: 0px .8px .9px hsl(var(--shadow-color) / .34), 0px 1.3px 1.5px -1.2px hsl(var(--shadow-color) / .34), -.1px 3px 3.4px -2.5px hsl(var(--shadow-color) / .34);--shadow-elevation-medium: 0px .8px .9px hsl(var(--shadow-color) / .36), 0px 2.5px 2.8px -.8px hsl(var(--shadow-color) / .36), -.1px 6.2px 7px -1.7px hsl(var(--shadow-color) / .36), -.3px 15.1px 17px -2.5px hsl(var(--shadow-color) / .36);--shadow-elevation-high: 0px .8px .9px hsl(var(--shadow-color) / .3), -.1px 4px 4.5px -.3px hsl(var(--shadow-color) / .3), -.1px 7.2px 8.1px -.6px hsl(var(--shadow-color) / .3), -.2px 11.3px 12.7px -.9px hsl(var(--shadow-color) / .3), -.3px 17.1px 19.2px -1.2px hsl(var(--shadow-color) / .3), -.5px 25.6px 28.8px -1.6px hsl(var(--shadow-color) / .3), -.7px 37.6px 42.3px -1.9px hsl(var(--shadow-color) / .3), -1px 54px 60.8px -2.2px hsl(var(--shadow-color) / .3), -1.4px 75.7px 85.2px -2.5px hsl(var(--shadow-color) / .3)}body,html,#root{height:100dvh;font-size:1rem;background-color:var(--primary-background-color)}@media screen and (max-width: 425px){body,html,#root{font-size:1.02rem}}#root{display:flex;flex-direction:column}.top-nav{display:flex;justify-content:flex-start;align-items:flex-start;background-color:var(--pretty-blue);box-shadow:var(--basic-box-shadow)}.content-container{z-index:1;margin-top:5px}.bottom-bar{display:flex;justify-content:space-between;margin-top:auto;flex-direction:column}.menu-item{padding:10px;border:2px solid var(--pretty-blue);background-color:var(--pretty-purple);border-radius:30px;margin:9px -2px 9px 8px;box-shadow:var(--basic-box-shadow)}.menu-item:hover{background-color:var(--pretty-purple-light)}.menu-item a{text-decoration:none;color:#fff}.primary-content{margin:38px 20px;background-color:var(--pretty-green);border-radius:30px;box-shadow:var(--basic-box-shadow);border:1px solid var(--primary-background-color);overflow:hidden}.text-content{padding:25px}footer{margin-top:auto;margin-bottom:20px}.justify-center{display:flex;justify-content:center;align-items:center}.menu-item.login-register-cta{display:flex;justify-content:center;align-items:center;cursor:pointer;height:100%;width:100%}.menu-item.login-register-cta svg{width:18px;height:18px}.expandable-menu{overflow:auto;margin:10px 10px 25px;display:flex;flex-direction:column;gap:14px}.expandable-menu>div>.menu-item-header .menu-item-wrapper{font-weight:700}.menu-item-header .secondary-value{display:inline-block;color:var(--pretty-purple-dark);font-size:.9rem;font-style:italic}.expandable-menu button .menu-arrow{border-color:var(--pretty-purple)}.expandable-menu button.open{background-color:var(--pretty-purple)}.expandable-menu button.open .menu-arrow{border-color:#fff}.expandable-menu button:hover{background-color:var(--pretty-blue)}.expandable-menu button:hover .menu-arrow{border-color:#fff}.expandable-menu button{--button-size: 25px;display:flex;justify-content:center;align-items:center;cursor:pointer;border:none;border-radius:50%;margin:5px 2px;text-align:center;height:var(--button-size);width:var(--button-size);min-width:var(--button-size)}.menu-arrow{display:block;width:4px;height:4px;min-width:4px;border-bottom:2px solid black;border-right:2px solid black;transform:rotate(-45deg)}.menu-arrow.open{transform:rotate(45deg)}.menu-item-wrapper{display:flex;flex-wrap:wrap;gap:2px 15px;align-items:baseline}.last-children{display:flex;flex-direction:column;gap:14px;background-color:var(--button-grey);border-radius:10px;padding:15px 10px;margin:10px 20px;box-shadow:var(--basic-box-shadow)}.tree-item-child{margin-left:35px}.last-children .tree-item-child{margin-left:0}@media screen and (max-width: 425px){.expandable-menu{gap:18px}.expandable-menu button{height:35px;width:35px;min-width:35px}.last-children{padding:20px 10px;margin:13px 0}.tree-item-child{margin-left:0}.menu-arrow{width:6px;min-width:6px;height:6px}}a.primary-link{color:var(--pretty-purple);font-weight:600;text-decoration:none}a.primary-link:hover{text-decoration:underline}.cute-bullet svg{width:30px;height:22px;display:flex;justify-content:center;align-items:center}@keyframes wave{0%{transform:rotate(0)}10%{transform:rotate(16deg)}20%{transform:rotate(-6deg)}30%{transform:rotate(16deg)}40%{transform:rotate(-4deg)}50%{transform:rotate(16deg)}60%{transform:rotate(0)}to{transform:rotate(0)}}.waving-hand svg{height:2.5rem;width:2.5rem;cursor:pointer}.waving-hand:hover{animation:wave 2.1s .6s infinite;transform-origin:75% 75%;display:inline-block}.home{max-width:1100px;margin:0 auto}.home-contact-links{display:flex;flex-wrap:wrap;align-items:center;gap:4px 0;margin-top:6px}.home-contact-links a:not(:last-child):after{content:"·";margin:0 12px;color:var(--grey);font-weight:400;display:inline-block}.home-intro{--headshot-size: 230px;display:flex;align-items:center;justify-content:flex-start;gap:40px;padding-bottom:0}.home-intro-text{display:flex;flex-direction:column;gap:10px;flex:1;max-width:70ch;line-height:1.5}.home-intro-header{display:flex;align-items:center;gap:6px;font-weight:700;font-size:2rem}.home-intro-header h1{margin:0;font-size:inherit}@media screen and (max-width: 600px){.home-intro-header{font-size:1.4rem}}.headshot{flex-shrink:0;margin-left:auto;width:var(--headshot-size);height:var(--headshot-size);border-radius:50%;overflow:hidden;border:4px solid var(--pretty-purple);box-shadow:var(--shadow-elevation-medium)}.headshot img{display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.01)}.home-skills-text{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:25px 40px;background-color:var(--pretty-blue-light)}.skill-group{display:flex;flex-direction:column;gap:12px}.skill-group-title{display:flex;align-items:center;gap:8px;font-weight:600}.skill-group-title{position:relative;padding:5px 12px 10px}.skill-group-title:after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background-color:var(--chip-color);box-shadow:0 1px 1px var(--pretty-blue)}.bullet-wrapper .cute-bullet svg{width:40px;height:30px;filter:drop-shadow(2px 2px 1px var(--pretty-blue))}.skill-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}.skill-chip{padding:5px 12px;border:2px solid var(--chip-color);background-color:var(--primary-background-color);box-shadow:var(--basic-box-shadow);font-size:.9rem;transition:transform .15s ease}.skill-chip:hover{transform:translateY(-2px)}@media screen and (max-width: 600px){.home-intro{--headshot-size: 120px;flex-direction:column-reverse;align-items:flex-start;gap:20px}.headshot{margin-left:0}}.about-me-blurb{display:flex;flex-direction:column;gap:20px}.music-container{--main-color: var(--pretty-purple);--hover-color: var(--pretty-blue);margin-left:auto;margin-right:1.1rem;display:flex;align-items:center;height:100%}@media screen and (max-width: 425px){.music-container{display:none}}.play-container{display:flex;justify-content:center;align-items:center;box-shadow:var(--basic-box-shadow);height:36px;width:36px;border-radius:100%;background-color:#fff;border:3px solid var(--hover-color)}button.music{--button-size: 30px;display:flex;background-color:var(--main-color);justify-content:center;align-items:center;cursor:pointer;text-align:center;height:var(--button-size);width:var(--button-size);border-radius:100%;border:1px solid var(--button-grey)}.play-container:hover{border:3px solid var(--hover-color)}.play-container:hover button.music{background-color:var(--hover-color)}button.music svg{fill:#fff;display:flex;justify-content:center;align-items:center;height:20px}.game-container{--game-height: 150px;--player-start-y: 209px;--player-start-x: 50px;height:var(--game-height);display:flex;flex-direction:column;justify-content:space-between}span.space-text{font-style:italic;color:var(--space-blue);font-weight:700}button.game-start{display:block;align-self:flex-end;margin:20px}.player{position:absolute;cursor:pointer;width:40px;height:40px;outline:none;border-radius:100%;box-shadow:var(--basic-box-shadow);background-color:var(--pretty-pink);top:var(--player-start-y);left:var(--player-start-x)}.player.jumping{animation:jump;animation-duration:.7s;animation-timing-function:linear;animation-delay:0s;animation-iteration-count:infinite;animation-direction:forwards}@keyframes jump{0%{top:var(--player-start-y);animation-timing-function:cubic-bezier(.33333,.66667,.66667,1)}69.0983%{top:104px;animation-timing-function:cubic-bezier(.33333,0,.66667,.33333)}to{top:var(--player-start-y)}}.background{display:flex;justify-content:space-around;margin-left:20px;padding:0 3px}.move-forward .grass-bunch{animation:moveForward;animation-duration:2s;animation-timing-function:linear;animation-delay:0s;animation-iteration-count:infinite}@media screen and (max-width: 425px){.move-forward .grass-bunch{animation-duration:1s}}.grass-bunch{display:flex;width:100%;transform:translate(100%)}.grass{width:3px;height:12px;transform:skew(-30deg);background-color:green}.grass-small{width:3px;height:8px;transform:skew(-15deg);background-color:green;margin-top:2px}@keyframes moveForward{0%{transform:translate(100%)}to{transform:translate(-100%)}}button.simple-button{font-size:1rem}.making-friends-container{height:400px;display:flex;flex-direction:column;justify-content:center}.loading-grid{justify-content:space-around;gap:10px;color:var(--pretty-purple)}.loading-grid .label{width:70%}.chat-box-container{background-color:var(--pretty-blue);overflow:hidden;padding:20px;margin:20px 0;border-radius:30px;height:100%;overflow:scroll}.chat-msg .user{font-weight:700}.chat-box *{overflow-anchor:none}.chat-box #anchor{overflow-anchor:auto;height:1px}.making-friends-container form{display:flex;gap:5px;flex-wrap:wrap}.making-friends-container form input{width:40%;font-size:1rem}@media screen and (max-width: 425px){.making-friends-container form input{width:100%}.loading-grid{justify-content:space-between}.loading-grid .label{width:100%}}.lds-default{color:var(--pretty-purple)}.lds-default,.lds-default div{box-sizing:border-box}.lds-default{display:inline-block;position:relative;width:80px;height:80px}.lds-default div{position:absolute;width:6.4px;height:6.4px;background:currentColor;border-radius:50%;animation:lds-default 1.2s linear infinite}.lds-default div:nth-child(1){animation-delay:0s;top:36.8px;left:66.24px}.lds-default div:nth-child(2){animation-delay:-.1s;top:22.08px;left:62.29579px}.lds-default div:nth-child(3){animation-delay:-.2s;top:11.30421px;left:51.52px}.lds-default div:nth-child(4){animation-delay:-.3s;top:7.36px;left:36.8px}.lds-default div:nth-child(5){animation-delay:-.4s;top:11.30421px;left:22.08px}.lds-default div:nth-child(6){animation-delay:-.5s;top:22.08px;left:11.30421px}.lds-default div:nth-child(7){animation-delay:-.6s;top:36.8px;left:7.36px}.lds-default div:nth-child(8){animation-delay:-.7s;top:51.52px;left:11.30421px}.lds-default div:nth-child(9){animation-delay:-.8s;top:62.29579px;left:22.08px}.lds-default div:nth-child(10){animation-delay:-.9s;top:66.24px;left:36.8px}.lds-default div:nth-child(11){animation-delay:-1s;top:62.29579px;left:51.52px}.lds-default div:nth-child(12){animation-delay:-1.1s;top:51.52px;left:62.29579px}@keyframes lds-default{0%,20%,80%,to{transform:scale(1)}50%{transform:scale(1.5)}}.coffee-shop-container{display:flex;justify-content:center;margin-bottom:40px}.coffee-shop-border{--coffee-shop-brown: #ad6a1d;--coffee-shop-beige: #d5b39c;--coffee-shop-pink: #b3736c;--coffee-shop-red: #712d29;--coffee-shop-light-brown: #a64b00;background-color:var(--coffee-shop-brown);width:486px;display:flex;justify-content:center;margin:20px;color:#fff;font-weight:700;font-size:12px}.coffee-shop-background{display:flex;flex-direction:column;gap:14px;background-color:var(--coffee-shop-beige);margin:20px;padding:22px}.upcoming-orders-container{background-color:var(--coffee-shop-brown);height:118px;display:flex;flex-direction:column;justify-content:flex-end;padding:0 12px;margin-top:10px;border-radius:4px}.upcoming-orders{position:absolute;display:flex;justify-content:flex-end;gap:15px;margin-bottom:19px;padding:0 15px}.upcoming-orders svg{width:60px;height:60px}.counter{background-color:var(--coffee-shop-light-brown);height:16px;width:100%;margin-top:-32px;margin-bottom:24px;box-shadow:var(--basic-box-shadow)}.counter-base{background-color:var(--coffee-shop-light-brown);height:16px;width:90%;margin:0 auto}.coffee-shop-border .bottom{display:flex;gap:12px;justify-content:space-between}.coffee-shop-board{display:flex;flex-direction:column}.coffee-shop-board .current-balance{background-color:var(--coffee-shop-pink);margin-top:12px;margin-bottom:12px;height:120px;display:flex;justify-content:center;align-items:center;flex-direction:column;padding:5px 0}.star{display:flex;justify-content:center;align-items:center;margin-top:8px}.star .balance-value{position:absolute;margin-top:10px}.coffee-shop-board button{background-color:var(--coffee-shop-red);border:1px solid var(--coffee-shop-pink);box-shadow:var(--shadow-elevation-medium);width:164px;padding:14px 5px;font-size:12px;font-weight:700;color:#fff;cursor:pointer}.coffee-shop-board button:hover{filter:brightness(110%)}.coffee-shop-board .menu{position:absolute;z-index:1}.coffee-shop-board .menu button{background-color:var(--coffee-shop-pink);border:1px solid var(--coffee-shop-red);display:flex;justify-content:space-between;padding:14px 15px}.current-order{display:flex;justify-content:flex-end;flex-direction:column;margin-top:18px;width:230px;height:188px}@media screen and (max-width: 425px){.coffee-shop-border{height:100%;width:100%}.coffee-shop-border .bottom{flex-direction:column}.coffee-shop-board{align-items:center}.coffee-shop-board .current-balance,.coffee-shop-board .menu-wrapper,.coffee-shop-board button{width:100%}.coffee-shop-board .menu button{min-width:180px}.upcoming-orders{gap:10px;padding:0 6px}.upcoming-orders .drink-order:nth-last-child(n+4){display:none}.current-balance{display:none}}.drink-order{cursor:pointer}.divider{width:100%;height:52px;background-color:var(--pretty-purple);--mask: radial-gradient(42.06px at 50% 57px, #000 99%, #0000 101%) calc(50% - 40px) 0/80px 51% repeat-x, radial-gradient(42.06px at 50% -37px, #0000 99%, #000 101%) 50% 20px/80px calc(51% - 20px) repeat-x, radial-gradient(42.06px at 50% calc(100% - 57px), #000 99%, #0000 101%) 50% 100%/80px 51% repeat-x, radial-gradient(42.06px at 50% calc(100% + 37px), #0000 99%, #000 101%) calc(50% - 40px) calc(100% - 20px) / 80px calc(51% - 20px) repeat-x;-webkit-mask:var(--mask);mask:var(--mask)}@keyframes flow{0%{margin-left:-1600px}to{margin-left:0}}.multi-divider{animation:flow 10s cubic-bezier(.36,.45,.63,.53) infinite;animation-fill-mode:forwards;animation-play-state:paused}.multi-divider:hover{animation-play-state:running}.modal-content-wrapper{display:flex;justify-content:center;align-items:center;position:fixed;z-index:1000;height:100%;width:100%;top:0;left:0;background-color:#4a70904d}.modal-content{width:400px}@media screen and (max-width: 425px){.modal-content{width:100%}}button.modal-cta{display:flex;justify-content:center;align-items:center;background:none;border:none;padding:0}.login-register-content{display:flex;justify-content:center;flex-direction:column;padding:40px 25px;border:6px solid var(--pretty-blue)}.login-register-content form{display:flex;flex-direction:column;margin:24px 0;gap:8px}.login-register-content button,.login-register-content input{font-size:1rem}.toggle-login-wrapper{display:flex}button.toggle-login{font-size:1rem;color:var(--pretty-purple-dark);font-weight:700;background:none;border:none;cursor:pointer;padding:0;font-style:italic}button.toggle-login:hover{text-decoration:underline}
