:root{
--text-color:#434a54;
--switch-color:#6bb917;
--desk-height:60px;
--tool-width:300px;
}

/* Reset */
html,body,ul,ol,li{margin:0;padding:0;}
ul,ol,dl{list-style-type:none;}
input,select,textarea,button{color:var(--text-color);font-family:inherit;font-size:100%;vertical-align:baseline;outline:none;}
em{font-style:normal;}
strong{font-weight:normal;}

html{font-size:10px;}
body{background-color:#fff;color:var(--text-color);font:1.4rem/1.6 -apple-system,'Segoe UI',Arial,'Microsoft YaHei',sans-serif,'Apple Color Emoji','Segoe UI Emoji';
-webkit-user-select:none;
user-select:none;
}

a,
a:hover{color:var(--text-color);text-decoration:none;}
a{
-webkit-touch-callout:none;
-webkit-tap-highlight-color:transparent;
}


/**
 * Notyf
 * ------------------------------ */
@keyframes notyf-in{
  0%{max-height:0;opacity:0;}
  to{max-height:300px;opacity:1;}
}

@keyframes notyf-out{
  0%{max-height:300px;opacity:1;}
  to{max-height:0;margin:0;opacity:0;}
}

@keyframes notyf-ripple{
  0%{transform:scale(0) translateY(-45%) translateX(13%);}
  to{transform:scale(1) translateY(-45%) translateX(13%);}
}

.notyf{box-sizing:border-box;position:fixed;top:0;left:0;z-index:9999;width:100%;height:100%;padding:var(--gap-default);color:#fff;pointer-events:none;
display:flex;
flex-direction:column;
align-items:flex-end;
justify-content:flex-end;
}

.notyf__toast{box-sizing:border-box;overflow:hidden;position:relative;max-width:300px;padding:0;border-radius:3px;box-shadow:0 4px 4px -2px rgba(0,0,0,0.3);pointer-events:auto;
display:block;
flex-shrink:0;
animation:notyf-in 0.3s ease-in forwards;
}

.notyf__toast--upper{margin-bottom:var(--gap-default);}
.notyf__toast--lower{margin-top:var(--gap-default);}

.notyf__wrapper{position:relative;z-index:10;padding:8px 12px;
display:flex;
align-items:center;
}


/* 内容 */
.notyf__message{position:relative;line-height:1.5em;vertical-align:middle;}


/* 图标 */
.notyf__icon{margin-right:8px;}

.notyf__icon--error,
.notyf__icon--success{display:block;position:relative;width:16px;height:16px;margin:0 auto;border-radius:50%;background-color:#fff;}

.notyf__icon--success:before{content:'';display:block;position:absolute;top:50%;left:50%;width:6px;height:3px;margin:-3px 0 0 -4px;border-bottom:2px solid currentColor;border-left:2px solid currentColor;
transform:rotate(-45deg);
}
.notyf__icon--error:before,
.notyf__icon--error:after{content:'';display:block;position:absolute;top:50%;left:50%;width:8px;height:2px;margin:-1px 0 0 -4px;border-radius:2px;background-color:currentColor;}
.notyf__icon--error:before{transform:rotate(45deg);}
.notyf__icon--error:after{transform:rotate(-45deg);}


/* 关闭按钮 */
.notyf__toast--dismissible .notyf__wrapper{padding-right:32px;}

.notyf__dismiss{position:absolute;top:0;bottom:0;right:0;width:24px;}

.notyf__dismiss-btn{position:absolute;top:0;left:0;width:100%;height:100%;border:none;background:rgba(0,0,0,0.1);outline:none;cursor:pointer;
transition-property:background-color;
transition-duration:0.2s;
}
.notyf__dismiss-btn:before,
.notyf__dismiss-btn:after{content:'';position:absolute;top:50%;left:50%;width:10px;height:2px;margin:-1px 0 0 -5px;border-radius:2px;background-color:#fff;}
.notyf__dismiss-btn:before{transform:rotate(45deg);}
.notyf__dismiss-btn:after{transform:rotate(-45deg);}

.notyf__dismiss-btn:hover{background-color:rgba(0,0,0,0.15);}
.notyf__dismiss-btn:active{background-color:rgba(0,0,0,0.2);}


/* 水波效果 */
.notyf__ripple{position:absolute;top:0;right:0;z-index:5;width:400px;height:400px;border-radius:50%;
transform:scale(0) translateY(-51%) translateX(13%);
transform-origin:bottom right;
animation:notyf-ripple 0.4s ease-out forwards;
}


/* 关闭动画 */
.notyf__toast--disappear{
animation:notyf-out 0.3s forwards;
}


/**
 * 操作台
 * ------------------------------ */
.desk{position:relative;z-index:8;height:var(--desk-height);margin-top:20px;}
.desk .box{box-sizing:border-box;position:fixed;bottom:0;left:0;right:0;padding:12px;background-color:rgba(255,255,255,0.9);box-shadow:0 -1px 2px rgba(0,0,0,0.2);
display:flex;
}
.desk section{background-color:#fff;
flex:none;
}
.desk section + section{margin-left:12px;}

.desk .btn{display:block;position:relative;height:34px;padding:0 1em;border:1px solid rgba(0,0,0,0.1);border-radius:5px;line-height:34px;}

.desk .in_toggle{margin-left:auto;}
.desk .in_toggle .btn{width:34px;padding:0;}
.desk .in_toggle .btn:before,
.desk .in_toggle .btn:after{content:'';position:absolute;top:50%;left:50%;width:16px;height:2px;margin-left:-8px;}
.desk .in_toggle .btn:before{margin-top:-1px;background-color:currentColor;}
.desk .in_toggle .btn:after{height:8px;margin-top:-6px;border-top:2px solid currentColor;border-bottom:2px solid currentColor;}


/* 年份选择 */
.desk .in_year{position:relative;padding:0 34px;border:1px solid rgba(0,0,0,0.1);border-radius:5px;line-height:34px;}
.desk .in_year a{position:absolute;top:0;bottom:0;width:34px;}
.desk .in_year a:before{content:'';position:absolute;top:50%;left:50%;width:0;height:0;margin:-5px 0 0 -4px;border-top:5px solid transparent;border-bottom:5px solid transparent;font-size:0;}
.desk .in_year a.prev{left:0;}
.desk .in_year a.next{right:0;}
.desk .in_year a.prev:before{border-right:8px solid currentColor;}
.desk .in_year a.next:before{border-left:8px solid currentColor;}
.desk .in_year select{height:34px;padding:0 0.5em;border:none;background:none;line-height:34px;outline:none;vertical-align:top;
-webkit-appearance:none;
}


/**
 * 选项
 * ------------------------------ */
.tool{position:fixed;top:0;bottom:0;left:100%;z-index:9;width:100%;
transition-property:left;
transition-delay:0.4s;
}
.tool .toggle{position:absolute;top:0;bottom:0;left:0;right:0;background-color:rgba(0,0,0,0);
transition-property:background-color;
transition-duration:0.4s;
}
.tool .gitbtn{position:absolute;bottom:6px;left:12px;right:12px;}
.tool .box{overflow-x:hidden;overflow-y:auto;position:absolute;top:0;bottom:0;right:0;left:calc(100% - var(--tool-width));z-index:5;padding:16px 12px;background-color:#f3f3f3;box-shadow:0 -2px 3px rgba(0,0,0,0.3);line-height:40px;
transform:translate(100%,0);
transition-property:transform;
transition-duration:0.4s;
overscroll-behavior:contain;
-webkit-overflow-scrolling:touch;
}
.tool section{position:relative;}
.tool section + section{margin-top:8px;}

.tool select{display:block;width:100%;box-sizing:border-box;height:40px;padding:0 12px;border:1px solid rgba(0,0,0,0.1);border-radius:5px;line-height:38px;outline:none;vertical-align:top;
background-color:#fff;
background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAFCAYAAACXU8ZrAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RjZENEEzNDgyM0NDMTFFNkJGNzlERURDQzlGQUE2NUQiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RjZENEEzNDkyM0NDMTFFNkJGNzlERURDQzlGQUE2NUQiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpGNkQ0QTM0NjIzQ0MxMUU2QkY3OURFRENDOUZBQTY1RCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpGNkQ0QTM0NzIzQ0MxMUU2QkY3OURFRENDOUZBQTY1RCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PlP2IVAAAAAwSURBVHjaYuno6PjPQAAwlZeXM+JTAJJngjFwKQCbhC6Alf///38UDHIjuhhAgAEA4DslhcbS5kEAAAAASUVORK5CYII=);
background-repeat:no-repeat;
background-position:right 8px center;
background-origin:border-box;
-webkit-appearance:none;
}

.tool .is_namevalue{position:relative;border:1px solid rgba(0,0,0,0.1);border-radius:5px;background-color:#fff;line-height:38px;cursor:pointer;
display:flex;
}
.tool .is_namevalue label{padding:0 12px;border-radius:4px 0 0 4px;background-color:rgba(0,0,0,0.1);color:rgba(0,0,0,0.3);
flex:0 0 5.5em;
}
.tool .is_namevalue input,
.tool .is_namevalue select{width:auto;height:38px;border:none;background-color:transparent;
flex:1;
}

/* 开关类型 */
.tool .is_switch input[type='checkbox']{display:none;}
.tool .is_switch input[type='checkbox'] + label{display:block;position:relative;padding:0 12px 0 36px;border:1px solid rgba(0,0,0,0.1);border-radius:5px;background-color:#fff;line-height:38px;cursor:pointer;
transition-property:border-color,color,opacity;
transition-duration:0.2s;
}
.tool .is_switch input[type='checkbox'] + label:before{content:'';position:absolute;top:50%;left:12px;width:16px;height:16px;margin-top:-8px;background-color:rgba(0,0,0,0.15);border-radius:3px;
transition-property:background-color;
transition-duration:0.2s;
}
.tool .is_switch input[type='checkbox'] + label:after{content:'';position:absolute;top:50%;left:20px;width:3px;height:7px;margin:-5px 0 0 -2px;border-bottom:1px solid #fff;border-right:1px solid #fff;
transform:rotate(45deg);
}

.tool .is_switch input[type='checkbox']:checked + label{border-color:var(--switch-color);color:var(--switch-color);}
.tool .is_switch input[type='checkbox']:checked + label:before{border-color:var(--switch-color);background-color:var(--switch-color);}

.tool .in_mode{display:none;}

.tool.show{left:0;
transition-delay:0s;
}
.tool.show .toggle{background-color:rgba(0,0,0,0.4);}
.tool.show .box{
transform:translate(0,0);
}





@media (min-width:768px) {
:root{
--tool-width:360px;
}
}


@media (min-width:1024px) {
.desk a{
transition-property:opacity;
transition-duration:0.2s;
}
.desk a:hover{opacity:0.8;}

.tool .box{padding:20px;}
.tool section + section{margin-top:12px;}
.tool .is_switch input[type='checkbox'] + label:hover{opacity:0.8;}

.tool .in_mode{display:flex;}
}


@media (min-width:1280px) {
body{
-webkit-user-select:auto;
user-select:auto;
}
}



/* iPhone X ~ 12 */
@media (device-width:375px) and (device-height:812px),
(device-width:414px) and (device-height:896px),
(device-width:390px) and (device-height:844px),
(device-width:428px) and (device-height:926px) {
.desk{height:calc(var(--desk-height) + env(safe-area-inset-bottom));}
.desk .box{padding-bottom:calc(12px + env(safe-area-inset-bottom));}
.tool .gitbtn{bottom:calc(12px + env(safe-area-inset-bottom));}
}


/* 打印 */
@media print {
body{
-webkit-print-color-adjust:exact;
color-adjust:exact;
}
.desk,
.tool{display:none;}
}