.select-buttons{display:flex}.select-buttons-vertical{display:flex;flex-direction:column}.select-button{border:none;color:var(--text-color);background-color:unset;border-bottom:3px solid rgba(0,0,0,0);padding:10px 23px}.select-button-vertical{border:none;color:var(--text-color);background-color:unset;border-left:3px solid rgba(0,0,0,0);padding:20px 30px 20px 20px}.select-button:hover{border-bottom:3px solid white}.select-button-vertical:hover{border-left:3px solid var(--text-color)}.select-button:active,.select-button-vertical:active{background-color:var(--background-color-active)}.select-button-selected{border:none;padding:10px 23px;background-color:unset;border-bottom:3px solid var(--selected-color);color:var(--selected-color)}.select-button-selected-vertical{border:none;padding:20px 30px 20px 20px;background-color:unset;border-left:3px solid var(--selected-color);color:var(--selected-color)}.select-buttons-small>button{padding:10px}.app-name{font-family:Birthstone,serif;margin-top:20px;font-style:normal;font-size:30px;color:var(--selected-color)}.layout-page{display:flex}.layout-menu{display:flex;flex-direction:column;padding:5px;height:100dvh;gap:50px;align-items:center}.profile-button{text-align:right}.layout-content{width:100%}@media (orientation: portrait){.layout-page{display:flex;flex-direction:column-reverse;height:100dvh}.layout-menu{display:flex;justify-content:center;padding:0;height:auto;gap:0px;align-items:center}.layout-content{height:100%}}@media (max-height: 580px){.layout-menu{justify-content:center}}.feed{display:flex;flex-direction:column;gap:10px;padding:10px;height:calc(100dvh - 20px);overflow:auto}.feed-song{padding:10px;border-bottom:2px solid var(--foreground-color);border-radius:5px 5px 0 0}.feed-song:hover{background-color:var(--background-color-hover)}@media (orientation: portrait){.feed{height:calc(100dvh - 70px)}}.button{color:var(--text-color);border:2px solid;padding:var(--padding);border-radius:5px;background-color:#0000;display:flex;gap:10px;align-items:center;text-align:center;font-size:var(--font-size);white-space:nowrap}.button:hover{background-color:var(--background-color-hover)}.button:active{background-color:var(--background-color-active)}.button-text{border:none}.button-small{padding:3px 7px;font-size:13px}.post-expanded{display:flex;flex-direction:column;gap:10px;overflow:auto}.post-expanded>div{background-color:var(--foreground-color);padding:10px;border-radius:5px}.post-header-expanded{padding:10px}.post-username-and-date{display:flex;align-items:center;gap:5px;font-size:14px;color:var(--text-color-secondary)}.post-username-and-date>button{padding:0;font-size:14px;background-color:#0000;color:var(--text-color-secondary);border:none;outline:none}.post-username-and-date>button:hover{color:var(--text-color)}.post-description{margin-top:5px}.post-rate-icons{display:flex;width:min-content;align-items:center;background-color:var(--background-color-hover);border-radius:5px}.post-footer{margin-top:10px;gap:5px;display:flex;align-items:center}.post-rating-active{color:var(--selected-color)}.post-share-button{display:flex;align-items:center;justify-content:center;width:100px}.loading-circle{width:40px;height:40px;animation:spin 1s linear infinite}.loading-circle-small{width:20px;height:20px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-container{display:flex;align-items:center}.loading-small{font-size:13px}.sign-in-page{display:flex;align-items:center;text-align:center;justify-content:center;vertical-align:middle;height:100dvh}.sign-in-container{padding:30px;width:400px;height:300px;display:flex;flex-direction:column;align-items:center;text-align:center;justify-content:center;gap:50px;border-radius:20px}.sign-in-welcome-text{display:flex;flex-direction:column}.my-profile-page{overflow:auto;display:flex;flex-direction:column;align-items:center;text-align:center;justify-content:space-between;height:calc(100dvh - 40px);padding-top:20px;padding-bottom:20px}.my-profile-details{display:flex;flex-direction:column;text-align:center}.my-profile-details>div>input{width:187px}.username-buttons{display:flex;align-items:center;justify-content:space-between}.my-profile-buttons{display:flex;gap:5px}.my-profile-buttons>button{width:150px;height:30px;display:flex;align-items:center;justify-content:center}.my-profile-buttons{display:flex;justify-content:space-between}@media (orientation: portrait){.my-profile-page{height:calc(100dvh - 120px)}}.icon-content{display:flex;align-items:center;padding:10px;gap:20px}.save-cancel-buttons{margin-top:20px;display:flex;align-items:center;justify-content:center;gap:5px}.share-settings-buttons{display:flex;align-items:center}.following-followers-buttons{display:flex;align-items:center;justify-content:center;gap:5px;margin-top:20px}.following-followers-buttons>button{display:flex;justify-content:center;width:150px;align-items:center}.my-profile-page-follow{gap:30px;display:flex;align-items:center;justify-content:space-between;padding:5px}.my-profile-page-follow-modal-buttons{display:flex;gap:5px}.error-icon{color:red;font-size:30px}.modal{position:fixed;top:0;bottom:0;left:0;right:0;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.modal-content{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 30px #00000080;border-radius:10px;background-color:var(--foreground-color);padding:10px}@media (orientation: portrait){.modal{background-color:var(--foreground-color)}.modal-content{box-shadow:none}}input{background-color:#0000;border:2px solid var(--text-color);color:var(--text-color);border-radius:5px;padding:var(--padding);font-size:var(--font-size)}input:focus{border:2px solid var(--selected-color);outline:2px solid var(--selected-color)}input::placeholder{color:var(--text-color)}.icon-button{padding:10px;border-radius:50px;border:none;color:var(--text-color);background-color:#0000;display:flex;gap:10px;align-items:center;text-align:center;font-size:var(--font-size)}.icon-button:hover{background-color:var(--background-color-hover)}.icon-button:active{background-color:var(--background-color-active)}.icon-button-disabled{padding:10px;border-radius:50px;border:none;color:var(--disabled-color);background-color:#0000;display:flex;gap:10px;align-items:center;text-align:center;font-size:var(--font-size)}.music-icon{font-size:30px;padding:10px;background-color:var(--foreground-color);border-radius:10px;min-width:30px;height:30px}.music-icon-hovered{background-color:var(--selected-color)}.project-card-container{display:flex;align-items:center;justify-content:space-between;padding:10px;border-radius:10px}.project-info{display:flex;align-items:center;gap:10px}.project-card-container-hovered{background-color:var(--background-color-hover)}.project-card-buttons{display:flex}.project-info>div{display:flex;flex-direction:column;gap:5px}.project-name{font-weight:700;word-break:break-all}.project-last-update{color:var(--text-color-secondary)}.are-you-sure-modal-content{padding:10px;display:flex;flex-direction:column;gap:50px}.are-you-sure-modal-buttons{display:flex;gap:5px;justify-content:center}.are-you-sure-modal-content-vertical{max-width:300px;word-wrap:break-word}.new-project-modal-content{padding:10px;display:flex;flex-direction:column;gap:15px}.new-project-modal-buttons{margin-top:20px;display:flex;gap:5px;justify-content:center}.new-project-input-container{display:flex;align-items:center}.new-project-input-container>span{width:100px}.new-project-modal-input{width:180px}.project-details-header{display:flex;align-items:center;padding:5px;min-width:300px;margin-bottom:10px;justify-content:space-between;height:22px;gap:20px}.project-details-header-buttons{display:flex;align-items:center;gap:5px}.project-description-lyrics{height:calc(100dvh - 60px);width:calc(100vw - 570px);display:flex;flex-direction:column;gap:5px;overflow:auto}.project-verse{min-height:20px}.project-lyrics-header,.project-description-header{display:flex;align-items:center;gap:5px;justify-content:space-between;background-color:var(--foreground-color);border-radius:10px 10px 0 0;padding:10px}.project-lyrics-content,.project-description-content{background-color:var(--foreground-color);overflow:auto;padding:10px;border-radius:0 0 10px 10px}.project-settings{display:flex;flex-direction:column;gap:30px;padding:10px}.project-settings-modal-buttons{display:flex;gap:5px;justify-content:center}.project-settings-container{display:flex;flex-direction:column;gap:15px}.project-settings-container>div{display:flex;gap:0px;align-items:center}.project-settings-name-input{width:180px}.project-settings-label{width:100px}.project-description-modal-content{display:flex;flex-direction:column;gap:10px}.project-description-modal-buttons{display:flex;align-items:center;justify-content:center;gap:5px}.project-description-modal-textarea{width:50vw;height:50vh;background-color:var(--background-color);border:none;outline:none;color:var(--text-color);padding:5px;border-radius:5px;resize:none}.projects-page{display:flex;gap:10px}.projects-page-header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.projects-container{height:calc(100dvh - 60px);overflow-y:auto}.projects{display:flex;flex-direction:column;gap:5px}.project-selection{display:flex;flex-direction:column;width:100%}.projects-page-header-buttons{display:flex;align-items:center;height:30px}.projects-page-message{display:flex;align-items:center;justify-content:center;width:100%;height:100%}@media (orientation: portrait){.projects-container{height:calc(100dvh - 110px)}}.editor-page{height:100dvh}.editor-page-content{display:grid;display:flex;height:100%}.editor-page-header{padding:5px;display:flex;height:26px}.editor-page-function{padding:5px;width:800px;background-color:var(--middleground-color);display:flex;flex-direction:column;gap:10px}.editor-function-body{height:calc(100dvh - 95px);display:flex;flex-direction:column;gap:10px;overflow:auto}.editor-function-header{display:flex;align-items:center;justify-content:space-between;gap:5px}.editor-content-message{padding:5px;display:flex;align-items:center;width:100%;justify-content:center;background-color:var(--foreground-color)}.editor-page-save-button-content{display:flex;align-items:center;justify-content:center;width:30px}.editor-textarea{width:100%;background-color:var(--foreground-color);color:var(--text-color);outline:none;border:none;padding:20px;resize:none}.editor-textarea::placeholder{color:var(--text-color)}.rhymes-content{display:flex;flex-direction:column;gap:10px}.rhymes-title{font-weight:700;color:var(--selected-color)}.rhymes-list{display:grid;grid-template-columns:auto auto auto}.post-page{overflow:auto;height:100dvh}.comment-editor{display:flex;padding:10px;flex-direction:column;gap:5px;width:500px}.comment-editor>div{display:flex;justify-content:end}.comment-editor>div>button{width:120px;display:flex;justify-content:center;background-color:var(--foreground-color)}.comment-editor>textarea{resize:none;height:100px;background-color:var(--foreground-color);color:var(--text-color);font-size:15px;padding:5px;border:2px solid var(--foreground-color);outline:none;border-radius:5px}.comment-editor>textarea:focus{border:2px solid var(--selected-color)}.comments-container{padding:10px;display:flex;flex-direction:column;gap:10px}.comment-username-and-date{display:flex;gap:5px;font-size:12px;padding:5px}.comment-username{font-weight:700;color:var(--selected-color)}.comment-content-container{display:flex;align-items:start;justify-content:space-between;max-width:500px}.comment-content{min-width:100px;min-height:20px;padding:5px;border-radius:5px;max-width:500px;white-space:pre-wrap;word-wrap:break-word}@media (max-width: 670px){.comment-editor{width:auto}}@media (orientation: portrait){.post-page{height:calc(100dvh - 50px)}.comment-editor{width:auto}}.profile-page{display:flex;flex-direction:column;gap:10px;height:calc(100dvh - 20px);overflow:auto}.profile-page-user-details{padding:10px}.profile-page-posts{display:flex;flex-direction:column;gap:10px}.profile-page-buttons{padding:10px}.profile-page-buttons>button{display:flex;align-items:center;justify-content:center;width:200px}.profile-page-posts-title{padding:10px}@media (orientation:portrait){.profile-page{height:calc(100dvh - 70px)}.profile-page-buttons{display:flex;align-items:center;justify-content:center}.profile-page-user-details{display:flex;align-items:center;justify-content:center;flex-direction:column}}.notifications{display:flex;flex-direction:column;gap:10px}.notifications>div{background-color:var(--foreground-color);padding:10px;border-radius:5px}.notification-date{font-size:12px}.follow-request-notification-content,.follow-request-notification-buttons{display:flex;gap:5px;align-items:center}.notification-profile-button{display:flex;align-items:center;gap:5px}.notification-profile-button>button{padding:0;background-color:#0000;color:var(--selected-color);border:0px}.notification-profile-button>button:hover{padding:0;background-color:#0000;color:var(--text-color-secondary)}:root{--background-color: #141414;--background-color-hover: rgba(255, 255, 255, .1);--background-color-active: rgba(255, 255, 255, .2);--background-color-selected: rgba(255, 255, 255, .1);--middleground-color: #202020;--foreground-color: #313131;--text-color: #e0e0e0;--text-color-secondary: #b1b1b1;--selected-color: #eb7134;--disabled-color: rgba(0, 0, 0, .2);--font-size: 16px;--icon-font-size: 20px;--small-icon-font-size: 25px;--padding-horizontal: 15px;--padding-vertical: 5px;--padding: 5px 15px 5px 15px}html,body{margin:0;padding:0;overflow:hidden}body{color:var(--text-color);background-color:var(--background-color);margin:0;font-family:Arial,sans-serif}h3{margin:0}textarea{font-size:14px}.icon{font-size:var(--icon-font-size)}.small-icon{font-size:var(--small-icon-font-size)}button{font-size:var(--font-size)}.center{display:flex;width:100%;align-items:center;text-align:center;justify-content:center}.page{margin:10px}.icon-text-div{display:flex;align-items:center;gap:5px}.icon-text-div>.text{margin-top:3px}.center{display:flex;align-items:center;justify-content:center;width:100%;height:100%}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:var(--selected-color);background:var(--text-color);border-radius:100px}::-webkit-scrollbar-thumb:hover{background:var(--selected-color)}::-webkit-scrollbar-track{background:none}@media (orientation: portrait){::-webkit-scrollbar{width:5px;height:5px}}
