:root{--primary-color:#5822ff;--apple-color:#cc3366;--play-color:#ffcc33}*{box-sizing:border-box;margin:0;padding:0}body{font-family:montserrat,sans-serif;background-color:var(--primary-color);transition:background-color .3s ease;color:#fff;min-height:100vh;display:flex;flex-direction:column}body.play{background-color:var(--play-color)}body.apple{background-color:var(--apple-color)}.container{max-width:800px;margin:0 auto;padding-left:1rem;padding-right:1rem;padding-top:1rem}#content{margin-top:auto}.header{text-align:center;margin-bottom:2rem}h1{font-family:montserrat-bold,sans-serif;font-size:3rem;margin-bottom:.5rem}h2{font-family:montserrat-bold,sans-serif;font-size:2rem;margin-bottom:.5rem}h3{font-family:montserrat-regular,sans-serif;font-size:1.5rem;margin-bottom:1rem}h4{font-family:roboto-light,sans-serif;font-size:1.5rem;margin-bottom:1rem}.two-column{display:flex;flex-wrap:wrap;gap:2rem;align-items:center;margin:0 auto}.column{flex:1;min-width:300px}.column-left{flex:1.2}.column-right{flex:.8;margin-top:auto}.store-buttons{display:flex;justify-content:center;gap:1.5rem;margin-bottom:2rem}.store-button{cursor:pointer}.store-button img{max-width:180px;transition:transform .2s ease}.store-button img:hover{transform:scale(1.05)}.iphone-container{position:relative;display:flex;justify-content:center;margin:0 auto;max-width:350px}.iphone{display:flex}.iphone img{max-width:100%;height:auto}.iphone-fill{position:absolute;bottom:0;left:50%;transform:translate(-50%);width:90%;height:auto}.project-info{background-color:rgba(0,0,0,.2);padding:1.5rem;border-radius:8px;margin-bottom:1.5rem}.project-info h3{margin-bottom:1rem}.project-info p{margin-bottom:1rem;line-height:1.6}.archived-badge{display:inline-block;background:#f33;color:#fff;padding:.25rem .75rem;border-radius:4px;font-weight:700;font-size:.9rem;margin-bottom:1rem}h1.play,h2.play,h3.play{color:#000}@font-face{font-family:Montserrat-Bold;src:url(/res/fonts/montserrat/Montserrat-Bold.otf)}@font-face{font-family:Montserrat-Regular;src:url(/res/fonts/montserrat/Montserrat-Regular.otf)}@font-face{font-family:Roboto-Light;src:url(/res/fonts/roboto/Roboto-Light.ttf)}@media(max-width:768px){.two-column{flex-direction:column}.column{width:100%}.store-buttons{justify-content:center;flex-direction:row}h1{font-size:2.5rem}}@media(max-width:480px){h1{font-size:2rem}.store-buttons{flex-direction:column;align-items:center}}