.drawer{position:fixed;top:0;right:0;bottom:0;left:0;transition:transform .5s;z-index:900;background:var(--color-blackbg);width:40rem;max-width:100%;color:#fff}.drawer-title h3{position:relative;padding:0;color:var(--color-reverse)}.drawer-title h3::before{display:inline-block;margin-right:1rem;background-color:var(--color-reverse);width:.5rem;height:1.5rem;content:''}.drawer-title__fold{position:absolute;right:2rem}.drawer-title__fold svg{position:relative;bottom:-5px;color:var(--color-reverse)}.drawer ul{overflow:hidden}.drawer__close{position:absolute;top:0;right:0;z-index:1000;margin:20px;padding:0;color:var(--color-reverse);background:#000}.drawer-save svg{color:var(--color-reverse);position:relative;bottom:-5px}.drawer-content{overflow-y:scroll;height:100vh;scrollbar-color:rgba(144,144,144,0.6) transparent}.drawer-content::-webkit-scrollbar{background:transparent}.drawer-content::-webkit-scrollbar-thumb{background:rgba(144,144,144,0.6)}.drawer-content > div{padding:1rem}.drawer-entry{display:grid;grid-template-rows:1fr 1fr;grid-template-columns:5rem 1fr 24px;padding:.5rem 0;gap:.5rem}.drawer-entry__add,.drawer-entry__save,.drawer-entry__delete{transition:.5s;padding:0;height:24px;vertical-align:bottom}.drawer-entry__delete{color:var(--color-reverse-sub)}.drawer-entry__delete:hover{color:var(--color-reverse)}.drawer-entry__add,.drawer-entry__save{margin:0 .5rem;color:var(--color-reverse)}.drawer-entry input:nth-of-type(2){grid-column-start:2;grid-column-end:4}.drawer-entry input:nth-of-type(3){color:var(--color-reverse-sub)}.drawer-entry > svg{margin:.2rem auto;color:var(--color-reverse)}.drawer input{transition:.5s;border:none;border-bottom:solid var(--color-reverse-sub) 2px;background-color:transparent;padding:.2rem .5rem;height:1.5rem;color:var(--color-reverse)}.drawer input:focus{border-bottom:solid var(--color-reverse) 2px}.drawer-sync{display:flex;flex-direction:column}.drawer-sync input{margin-bottom:.5rem}.drawer-about{margin:.5rem 0;color:var(--color-reverse)}.drawer-about a{color:var(--color-reverse)}.l-button{transition:.5s;margin:.5rem;border:solid var(--color-reverse-sub) 2px;padding:.5rem;width:max-content;color:var(--color-reverse);align-items:center;display:flex}.l-button svg{margin-right:.5rem}.l-button:hover{border:solid var(--color-reverse) 2px}.down{animation:turn-up 1s linear 1}.width-btn{width:100% !important;text-align:center;display:inline-flex;align-items:center;justify-content:center}@-moz-keyframes turn-up{0%{transform:rotate(0)}25%{transform:rotate(45deg)}50%{transform:rotate(90deg)}75%{transform:rotate(135deg)}100%{transform:rotate(180deg)}}@-webkit-keyframes turn-up{0%{transform:rotate(0)}25%{transform:rotate(45deg)}50%{transform:rotate(90deg)}75%{transform:rotate(135deg)}100%{transform:rotate(180deg)}}@-o-keyframes turn-up{0%{transform:rotate(0)}25%{transform:rotate(45deg)}50%{transform:rotate(90deg)}75%{transform:rotate(135deg)}100%{transform:rotate(180deg)}}@keyframes turn-up{0%{transform:rotate(0)}25%{transform:rotate(45deg)}50%{transform:rotate(90deg)}75%{transform:rotate(135deg)}100%{transform:rotate(180deg)}}.searchbar{display:flex;flex-wrap:nowrap;align-items:center;transition:.5s;border-radius:var(--search-border-radius);background:#fff}.searchbar-wrap{margin:0;padding:.5rem 1rem}.searchbar__select{display:inline-block;flex-shrink:0;border-radius:var(--search-border-radius) 0 0 var(--search-border-radius);cursor:pointer;padding:var(--search-padding);padding-right:0;padding-left:var(--search-border-radius);height:var(--search-font);color:var(--search-engine-color)}.searchbar__select svg{position:relative;top:-2px;color:var(--search-engine-color)}.searchbar__select svg:hover{color:var(--color-main)}.searchbar__select span{display:inline-block;vertical-align:middle}.searchbar__delete svg{position:relative;bottom:-2px;color:var(--search-engine-color)}.searchbar__input{border:none;background-color:transparent;padding:var(--search-padding);width:100%;height:var(--search-font);font-size:1rem}.searchbar__btn{flex-shrink:0;border:none;cursor:pointer;padding:var(--search-padding);padding-right:var(--search-border-radius);height:calc(var(--search-font) + 2 * var(--search-padding));font-size:var(--search-font)}.searchbar__btn svg{position:relative;top:-2px;color:var(--search-engine-color)}.searchbar__btn svg:hover{color:var(--color-main)}.searchbar-list{position:relative;transition:.2s;margin:0 1rem;border-radius:var(--search-border-radius);background:var(--color-blackbg);padding:var(--search-padding) var(--search-border-radius);color:var(--color-reverse)}.searchbar-list::before{position:absolute;top:-.7rem;border-width:0 var(--search-tri) var(--search-tri) var(--search-tri);border-style:solid;border-color:transparent transparent var(--color-blackbg) transparent;width:0;height:0;content:''}.searchbar-list ul{display:grid;width:100%;gap:1rem}.searchbar-list li{min-width:24px;height:24px}.searchbar-list li a{display:inline-block;transition:.3s;cursor:pointer;min-height:24px}.searchbar-list li a span{display:inline-block;vertical-align:middle}.searchbar-list li a:hover{color:var(--color-main)}@media screen and (max-width:750px){.timebar{min-width:14rem;margin-top:2rem}.timebar__time{font-size:3em}.timebar__date{font-size:1.3em}.timebar__week{font-size:1.8em}.searchbar-list ul{grid-template-columns:1fr 1fr 1fr 1fr}.nav ul{grid-template-columns:1fr 1fr}.main{padding-top:12rem}}@media screen and (min-width:750px){.timebar{min-width:20rem;margin-top:4rem}.timebar__time{font-size:5em}.timebar__date{font-size:2em}.timebar__week{font-size:3em}.searchbar-list ul{grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr 1fr}.nav ul{grid-template-columns:1fr 1fr 1fr 1fr}.main{padding-top:20rem}}.page-nav{bottom:-300px}.nav{padding:.5rem 1rem}.nav ul{display:grid;width:100%;gap:1rem}.nav li a{color:var(--color-reverse);text-decoration:none;cursor:pointer;padding:.3rem .5rem;background:#000;display:flex;align-items:center;justify-content:center;transition:.2s;color:var(--color-reverse);user-select:none;height:100%;font-size:15px}.nav li a:active{background:#888}.nav li a:hover{background:var(--color-main)}.nav li a svg{margin-right:10px}:root{--container-width:40rem;--search-border-radius:2rem;--search-font:1.2rem;--search-padding:.9rem;--search-engine-color:#909090;--search-tri:.7rem;--color-blackbg:rgba(0,0,0,0.5);--color-main:#ff3f81;--color-darker:#df004d;--color-reverse:#fff;--color-reverse-sub:#4e4e4e;font-size:16px}body{margin:0;overflow-y:hidden;font-family:'Microsoft Yahei',sans-serif;background-color:#333}button{border:none;background-color:transparent;cursor:pointer}ul{margin:0;padding:0}li{list-style-type:none}input,select,textarea{outline:none}.bg{position:fixed;top:0;bottom:0;margin:0;background-size:cover;width:100%}.container{margin:0 auto;position:relative;max-width:var(--container-width)}.gear{position:fixed;top:0;left:0;margin:1rem;padding:0;color:var(--color-darker)}.gear svg:hover{transition:color .5s;animation:turn 1s linear infinite;color:var(--color-reverse)}.page{height:100vh;position:relative}.show{opacity:1;animation:show .5s cubic-bezier(.76,.05,.86,.06) 1}.hidden{opacity:0;animation:hidden .5s cubic-bezier(.22,.61,.36,1) 1}.button-arrow{position:absolute;bottom:2rem;color:var(--color-reverse);transform:translateX(-50%);margin-left:50%;cursor:pointer;opacity:.5;transition:color .5s}.button-arrow svg{width:40px;height:40px}.to-nav:hover{opacity:1;animation:tonav 1s ease-out infinite}.to-search:hover{opacity:1;animation:tosearch 1s ease-out infinite}@font-face{font-family:'Fjalla One';font-style:normal;font-weight:400;src:url("./Fjalla_One.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}.timebar{padding:1rem;width:17%;color:var(--color-reverse);font-size:1rem;user-select:none;position:fixed;margin-left:50%;transform:translateX(-50%)}.timebar__time,.timebar__date,.timebar__week{width:100%;text-align:justify;text-align-last:justify;font-family:'Fjalla One'}.timebar__hr{background:var(--color-reverse);height:2px}@-moz-keyframes turn{0%{transform:rotate(0)}25%{transform:rotate(90deg)}50%{transform:rotate(180deg)}75%{transform:rotate(270deg)}100%{transform:rotate(360deg)}}@-webkit-keyframes turn{0%{transform:rotate(0)}25%{transform:rotate(90deg)}50%{transform:rotate(180deg)}75%{transform:rotate(270deg)}100%{transform:rotate(360deg)}}@-o-keyframes turn{0%{transform:rotate(0)}25%{transform:rotate(90deg)}50%{transform:rotate(180deg)}75%{transform:rotate(270deg)}100%{transform:rotate(360deg)}}@keyframes turn{0%{transform:rotate(0)}25%{transform:rotate(90deg)}50%{transform:rotate(180deg)}75%{transform:rotate(270deg)}100%{transform:rotate(360deg)}}@-moz-keyframes tonav{0%{bottom:2rem}100%{bottom:1rem}}@-webkit-keyframes tonav{0%{bottom:2rem}100%{bottom:1rem}}@-o-keyframes tonav{0%{bottom:2rem}100%{bottom:1rem}}@keyframes tonav{0%{bottom:2rem}100%{bottom:1rem}}@-moz-keyframes tosearch{0%{bottom:1rem}100%{bottom:2rem}}@-webkit-keyframes tosearch{0%{bottom:1rem}100%{bottom:2rem}}@-o-keyframes tosearch{0%{bottom:1rem}100%{bottom:2rem}}@keyframes tosearch{0%{bottom:1rem}100%{bottom:2rem}}@-moz-keyframes hidden{0%{opacity:1}100%{opacity:0}}@-webkit-keyframes hidden{0%{opacity:1}100%{opacity:0}}@-o-keyframes hidden{0%{opacity:1}100%{opacity:0}}@keyframes hidden{0%{opacity:1}100%{opacity:0}}@-moz-keyframes show{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes show{0%{opacity:0}100%{opacity:1}}@-o-keyframes show{0%{opacity:0}100%{opacity:1}}@keyframes show{0%{opacity:0}100%{opacity:1}}