.dropdown{position:relative}.dropdown .dropdown-left,.dropdown .dropdown-right{display:none;position:absolute;top:100%;white-space:nowrap;background-color:#f0f0f0;padding:0 15px}.dropdown .dropdown-left{left:0}.dropdown .dropdown-right{right:0}.dropdown:hover .dropdown-left,.dropdown:hover .dropdown-right{display:block}:root{--gradient-tuna-galiba: linear-gradient(to right, oklch(67.305% .16468 307.074), oklch(83.736% .13074 85.582));--color-text: #000000;--color-text-small: #5a5a5a;--color-text-aux: #5a5a5a;--color-text-clickable: #b177e4;--color-text-inner: #ffffff;--color-dummy-color: #ececec;--color-text-important: rgb(255, 128, 130);--color-mine-outline: oklch(83.736% .13074 85.582);--color-hr-border: #b8b8b8;--color-input-border: #989898;--color-background: #efefef;--color-article-background: #ffffff;--color-topmenu-background: #ffffff;--color-bottommenu-background: rgba(255, 255, 255, .7);--color-bottommenu-article-background: rgb(255, 255, 255);--color-icon-inactive: #676767;--color-icon-active-favorite: rgb(255, 128, 130);--color-icon-reply: #00ff00;--color-icon-active-buttommenu: #484848;--color-icon-postinfo: #8a8a8a;--color-icon-post: var(--color-background);--color-icon-queueinfo: rgba(0, 0, 0, .35);--color-shadow: rgba(0,0,0,.3);--color-shadow-relative: rgba(0,0,0,.3)}html,body{height:100%;background-color:var(--color-background);color:var(--color-text);font-size:15px;overflow:hidden;-webkit-tap-highlight-color:transparent}body{font-family:system-ui,sans-serif;margin:0;padding:0}body>#root{height:100%}a,a:visited,a:hover,a:active{color:var(--color-text);text-decoration:none}button{color:var(--color-text)}.text-small{color:var(--color-text-small);font-size:14px}.text-aux{color:var(--color-text-aux);font-size:11px}.text-clickable{color:var(--color-text-aux);font-size:14px}.text-important{color:var(--color-text-important);font-size:15px}.dummy-text{background-color:var(--color-dummy-color);height:15px}.dummy-text-small{background-color:var(--color-dummy-color);height:14px}.dummy-text-aux{background-color:var(--color-dummy-color);height:11px}#top-menu{position:fixed;top:0;left:0;z-index:100;width:100%;height:auto;margin:0;box-sizing:border-box;background-color:var(--color-topmenu-background);border-radius:0 0 20px 20px;box-shadow:0 0 12px -4px var(--color-shadow);padding:0;padding-top:env(sae-area-inset-top);padding-bottom:10px}#top-menu>#top-menu-main{margin:0;display:flex;justify-content:space-between;padding:0 10px}:is(#top-menu>#top-menu-main)>svg{color:var(--color-text-small);margin:13px 1px 2px 5px;height:17px;width:auto}:is(#top-menu>#top-menu-main)>span{margin:11px 10px 2px;max-width:240px}#top-menu>#advance-top-menu{margin:0;padding:0}.queue:is(#top-menu>#advance-top-menu)>#queue-type-selector ul{margin:0;display:flex;justify-content:space-between;padding:0 5%}:is(.queue:is(#top-menu>#advance-top-menu)>#queue-type-selector ul)>li{margin:0;width:70px;height:35px;list-style:none;display:flex;align-items:center;flex-direction:column;padding:0}:is(:is(.queue:is(#top-menu>#advance-top-menu)>#queue-type-selector ul)>li)>a{margin-top:5%}:is(:is(:is(.queue:is(#top-menu>#advance-top-menu)>#queue-type-selector ul)>li)>a)>span{color:var(--color-text)}:is(:is(.queue:is(#top-menu>#advance-top-menu)>#queue-type-selector ul)>li)>div{margin-top:4px;width:70px;height:2px;background:var(--gradient-tuna-galiba)}.queue:is(#top-menu>#advance-top-menu)>#queue-selector{overflow-x:auto}:is(.queue:is(#top-menu>#advance-top-menu)>#queue-selector)>ul{margin:0;list-style:none;display:flex;padding:0 10px;justify-content:center;min-width:max-content}:is(:is(:is(.queue:is(#top-menu>#advance-top-menu)>#queue-selector)>ul)>li)>button{margin:0 15px;height:26px;background-color:transparent;border:none;padding:0;cursor:pointer;white-space:nowrap}:is(:is(:is(:is(.queue:is(#top-menu>#advance-top-menu)>#queue-selector)>ul)>li)>button)>svg{width:15px;height:15px}:is(:is(:is(.queue:is(#top-menu>#advance-top-menu)>#queue-selector)>ul)>li)>div{margin:2px auto auto;width:70px;height:2px;background:var(--gradient-tuna-galiba)}#bottom-menu{position:fixed;bottom:0;left:0;z-index:100;width:100%;margin:0;box-sizing:border-box;background-color:var(--color-bottommenu-background);border-radius:20px 20px 0 0;box-shadow:0 0 12px -4px var(--color-shadow);padding-bottom:constant(safe-area-inset-bottom);padding-bottom:env(safe-area-inset-bottom)}#bottom-menu>ul{margin:0;display:flex;justify-content:space-between;padding:13px 10% 18px}:is(#bottom-menu>ul)>li{margin:0;width:90px;height:30px;list-style:none;display:flex;justify-content:center;align-items:center;padding:0}:is(:is(:is(#bottom-menu>ul)>li)>a)>div{width:90px;border-radius:15px;background-color:var(--color-bottommenu-article-background);display:flex;flex-direction:column;align-items:center}:is(:is(:is(:is(#bottom-menu>ul)>li)>a)>div)>div{width:23px;height:23px}:is(:is(:is(:is(:is(#bottom-menu>ul)>li)>a)>div)>div)>svg{color:var(--color-icon-inactive);width:23px;height:23px}:is(:is(:is(#bottom-menu>ul)>li)>a)>div.active{background:var(--gradient-tuna-galiba)}:is(:is(:is(:is(#bottom-menu>ul)>li)>a)>div.active)>div>svg{color:var(--color-bottommenu-article-background)}:is(:is(:is(:is(#bottom-menu>ul)>li)>a)>div.active)>span{color:var(--color-bottommenu-article-background)}main{max-width:712px;margin:auto;box-sizing:border-box;height:100%;overflow-y:auto;background-color:var(--color-background);scroll-behavior:smooth;overscroll-behavior:none;scrollbar-width:none;padding:10px}#ranking-page{margin:0;padding:40px 10px 55px}#ranking-page>p#nothing{margin-top:30px;text-align:center}#ranking-page>ul{margin:0;padding:0}:is(#ranking-page>ul)>li{margin:0;list-style:none;padding:0}#queue-page{margin:0;padding:100px 0 55px}#queue-page>ul{margin:0;padding:0}:is(#queue-page>ul)>li{margin:9px 3px;list-style:none}#queue-page>p#waiting{margin-top:30px;text-align:center}#detail-page{margin:0;padding:40px 0 55px}#detail-page>#detail-post{margin:12px 3px;list-style:none}#detail-page>#detail-reply ul{margin:0;padding:0}:is(#detail-page>#detail-reply ul)>li{margin:12px 9px 12px 13%;list-style:none}#menu-page{margin:0;padding:40px 10px 55px}#menu-page>ul{margin:0;padding:0}:is(#menu-page>ul)>li{margin:8px 10px;list-style:none;display:flex;justify-content:space-between;padding:13px 12px 15px}#post{box-sizing:border-box;background-color:var(--color-article-background);padding:9px 12px 12px;border-radius:10px;box-shadow:0 0 12px -4px var(--color-shadow)}#post.mine{outline:solid 1px var(--color-mine-outline)}#post>header{display:flex;justify-content:space-between}:is(#post>header)>#head{display:flex;justify-content:space-between;margin-right:10px;width:100%}:is(:is(#post>header)>#head)>span{margin:0;text-align:left}:is(:is(:is(#post>header)>#head)>span)>div{width:60px}:is(:is(#post>header)>#head)>time{margin:0;text-align:right}:is(:is(:is(#post>header)>#head)>time)>div{width:60px}:is(#post>header)>button{background-color:transparent;border-width:1px;border:none;padding:2px 0 0}:is(:is(#post>header)>button)>svg{color:var(--color-icon-postinfo);width:12px;height:12px}#post>img{width:100%;padding:10px 5%;box-sizing:border-box}#post>div#text{margin:5px 10px 10px}:is(#post>div#text)>p{margin:0;padding:0}#post>hr{background-color:var(--color-hr-border);border-style:solid;width:95%;height:1px;margin-top:0;border:none}#post>footer{margin:0 0 0 5px;display:flex;justify-content:left;padding-left:10px;padding-right:10px}:is(#post>footer)>#buttons{width:65%;display:flex;justify-content:space-between}:is(:is(#post>footer)>#buttons)>div{width:100%}:is(:is(:is(#post>footer)>#buttons)>div)>button{background-color:transparent;border-width:1px;border:none;padding:0;position:relative;top:2px;box-shadow:none}:is(:is(:is(:is(#post>footer)>#buttons)>div)>button)>svg{width:16px;height:16px;color:var(--color-icon-inactive)}.active:is(:is(:is(:is(:is(#post>footer)>#buttons)>div)>button)>svg){color:var(--color-icon-active-favorite)}:is(#post>footer)>#stump{width:35%;height:auto}:is(:is(#post>footer)>#stump)>svg{position:fixed;right:28px;bottom:15px;z-index:5;width:24px;height:auto}#reply{background-color:var(--color-article-background);padding:13px 12px 15px;border-radius:10px;box-shadow:0 0 12px -4px var(--color-shadow)}#reply.mine{outline:solid 1px var(--color-mine-outline)}#reply>header{display:flex;justify-content:space-between}:is(#reply>header)>#head{display:flex;justify-content:space-between;margin-right:10px;width:100%}:is(:is(#reply>header)>#head)>span{margin:0;text-align:left}:is(:is(#reply>header)>#head)>time{margin:0;text-align:right}:is(#reply>header)>button{background-color:transparent;border-width:1px;border:none;padding:2px 0 0}:is(:is(#reply>header)>button)>svg{color:var(--color-icon-postinfo);width:12px;height:12px}#reply>div#text{margin:10px 10px 14px}:is(#reply>div#text)>p{margin:0;padding:0}#post-button{position:fixed;right:20px;bottom:90px;z-index:20;width:60px;height:60px;background:var(--gradient-tuna-galiba);border-width:1px;border:none;border-radius:30%;box-shadow:0 0 15px -2px var(--color-shadow-relative)}#post-button>svg{width:30px;height:30px;color:var(--color-icon-post)}#reply-button{position:fixed;right:20px;bottom:90px;z-index:20;width:60px;height:60px;background:var(--gradient-tuna-galiba);border-width:1px;border:none;border-radius:30%;box-shadow:0 0 15px -2px var(--color-shadow-relative)}#reply-button>svg{width:30px;height:30px;color:var(--color-icon-post)}#queue-info-button{position:fixed;right:20px;bottom:165px;z-index:20;width:35px;height:35px;background-color:var(--color-icon-queueinfo);border-width:2px;border-style:none;border-radius:40%;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);box-shadow:0 0 15px -2px var(--color-shadow-relative)}#queue-info-button>svg{width:16px;height:16px;color:var(--color-icon-post)}#ranking{margin:8px 10px;background-color:var(--color-article-background);border-radius:10px;box-shadow:0 0 12px -4px var(--color-shadow);display:flex;justify-content:space-between;padding:12px 18px 12px 13px}#ranking>#rank{width:40px;height:31px;display:flex;justify-content:right;align-items:flex-end}:is(#ranking>#rank)>p{margin:0;font-size:25px}#ranking>#user{width:100%;display:flex;justify-content:space-between;align-items:flex-end;padding:0 0 4px 15px}:is(#ranking>#user)>p#user-name{margin:0;padding:0;font-size:17px}:is(#ranking>#user)>p#user-score{margin:0;padding:0;font-size:12px}#overlay-modal{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#00000080;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);display:flex;align-items:center;justify-content:center;z-index:500}#overlay-modal>section{margin-bottom:20vh;max-width:80%;padding:13px 12px 15px;width:auto;height:auto;border-radius:20px;background-color:var(--color-article-background)}:is(#overlay-modal>section)>header{height:38px}:is(:is(#overlay-modal>section)>header)>#modal-close-button{position:fixed;background-color:transparent;border:none;padding:0;cursor:pointer;margin-top:3px;margin-left:3px}:is(:is(:is(#overlay-modal>section)>header)>#modal-close-button)>svg{width:15px;height:15px}:is(:is(#overlay-modal>section)>header)>h1{text-align:center;margin:0}:is(#overlay-modal>section)>footer{display:flex;margin-top:15px;height:30px}:is(#overlay-modal>section) footer>button{margin-top:auto;margin-bottom:auto;background-color:transparent;border-style:none;color:var(--color-text-clickable)}:is(#overlay-modal>section) footer>button.confirm{margin-left:auto;margin-right:6px;padding:5px 15px;background-color:var(--color-text-clickable);color:var(--color-text-inner);border-radius:7px}#overlay-form{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#00000080;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);display:flex;align-items:center;justify-content:center;z-index:500}#overlay-form>section{box-sizing:border-box;width:100%;height:100%;padding:13px 12px 15px;border-radius:20px 0 0 20px;background-color:var(--color-article-background)}:is(#overlay-form>section)>form{width:100%}:is(:is(#overlay-form>section)>form)>header{height:30px;margin-bottom:20px;display:flex;justify-content:space-between}:is(:is(:is(#overlay-form>section)>form)>header)>div{display:flex;gap:15px}:is(:is(:is(:is(#overlay-form>section)>form)>header)>div)>#modal-close-button{background-color:transparent;border:none;padding:0;cursor:pointer;margin-top:3px;margin-left:3px}:is(:is(:is(:is(:is(#overlay-form>section)>form)>header)>div)>#modal-close-button)>svg{width:15px;height:15px}:is(:is(:is(:is(#overlay-form>section)>form)>header)>div)>h1{margin:auto}:is(:is(:is(#overlay-form>section)>form)>header)>#modal-confirm-button{background-color:transparent;border:none;cursor:pointer;padding:5px 15px;background-color:var(--color-text-clickable);color:var(--color-text-inner);border-radius:7px}:is(:is(#overlay-form>section)>form)>footer{display:flex;margin-top:15px;height:30px}:is(:is(#overlay-form>section)>form) textarea{box-sizing:border-box;width:100%;height:300px;padding:8px 10px;background-color:var(--color-article-background);color:var(--color-text);font-size:16px;border-style:none}:is(:is(#overlay-form>section)>form) input{padding:8px 10px;background-color:var(--color-article-background);color:var(--color-text);font-size:16px;border-style:none}:is(#overlay-form>section#post-form)>textarea{box-sizing:border-box;width:100%;height:80px}:is(#overlay-form>section#post-form)>p{margin-left:8px}#overlay-modal>section#save-form{width:90%}:is(#overlay-modal>section#save-form)>input{box-sizing:border-box;width:100%;margin-bottom:15px}:is(#overlay-modal>section#save-form)>p{margin:0 0 0 8px}#overlay-bottom-sheet{position:fixed;bottom:0;left:0;width:100vw;height:100vh;background-color:#00000080;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);display:flex;align-items:end;justify-content:center;z-index:500}#overlay-bottom-sheet>section{padding:13px 12px 15px;padding-bottom:calc(15px + constant(safe-area-inset-bottom));padding-bottom:calc(15px + env(safe-area-inset-bottom));width:100%;height:auto;border-radius:20px 20px 0 0;background-color:var(--color-article-background)}:is(#overlay-bottom-sheet>section)>footer{display:flex;margin-top:15px;height:30px}:is(#overlay-bottom-sheet>section)>ul{margin:17px 0 0 12px;padding:0}:is(:is(#overlay-bottom-sheet>section)>ul)>li{list-style:none;padding:10px;border-bottom:1px solid var(--color-hr-border)}:is(:is(:is(#overlay-bottom-sheet>section)>ul)>li)>button{border-style:none;background-color:transparent}:is(#overlay-bottom-sheet>section) footer>button{margin:auto;background-color:transparent;border-style:none;color:var(--color-text-clickable)}#auth>article{overflow:hidden;position:fixed;left:0;right:0;margin:100px auto;width:80%;max-width:430px;height:450px;box-sizing:border-box;background-color:var(--color-article-background);padding:13px 12px 15px;border-radius:25px;box-shadow:0 0 12px -4px var(--color-shadow)}:is(#auth>article)>header{padding-top:0;padding-bottom:13px}:is(:is(#auth>article)>header)>#logo{display:flex;align-items:center;justify-content:center}:is(:is(:is(#auth>article)>header)>#logo)>svg.icon{height:35px;width:auto}:is(:is(:is(#auth>article)>header)>#logo)>svg.text{margin-bottom:-6px;height:20px;width:auto}:is(:is(#auth>article)>header)>span{display:flex;justify-content:center}:is(#auth>article)>hr{margin:0 20px;border-style:solid;border-width:1px;border-color:var(--color-hr-border)}:is(#auth>article)>main{position:absolute;left:0;right:0;overflow:hidden;margin:0 10px;height:auto;background-color:transparent}:is(:is(#auth>article)>main)>div{margin:10px 0 20px}.slogan:is(:is(:is(#auth>article)>main)>div){margin-bottom:40px}:is(:is(:is(#auth>article)>main)>div)>h1{font-size:25px;margin:5px 0}:is(:is(:is(#auth>article)>main)>div)>h2{margin:8px 0;font-size:16px;font-weight:400}:is(:is(:is(#auth>article)>main)>div)>a.button{display:flex;justify-content:center;margin:0 10%;padding:4px 0 7px;border-radius:15px;background-color:var(--color-text-clickable);color:var(--color-article-background);font-weight:700}:is(:is(:is(#auth>article)>main)>div) a{color:var(--color-text-clickable);font-weight:700}:is(:is(#auth>article)>main)>form{margin:0;padding:0}:is(:is(:is(#auth>article)>main)>form)>#error-message{margin:0;font-weight:700}:is(:is(:is(#auth>article)>main)>form)>input{box-sizing:border-box;margin:10px 0;padding:0 7px;height:32px;width:100%;font-size:15px;border-radius:5px;border-width:2px;border-style:solid;border-color:var(--color-input-border)}:is(:is(:is(#auth>article)>main)>form)>button{margin:20px 0;box-sizing:border-box;width:50%;padding:4px 0 7px;border-style:none;border-radius:15px;background-color:var(--color-text-clickable);color:var(--color-article-background);font-weight:700;font-size:15px}
