html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0}:focus{outline:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{-webkit-appearance:none;-moz-appearance:none}input[type=search]{-webkit-appearance:none;-moz-appearance:none;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}textarea{overflow:auto;vertical-align:top;resize:vertical}audio,canvas,video{display:inline-block;*display: inline;*zoom: 1;max-width:100%}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}a:focus{outline:thin dotted}a:active,a:hover{outline:0}img{border:0;-ms-interpolation-mode:bicubic}figure{margin:0}form{margin:0}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0;white-space:normal;*margin-left: -7px}button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align: middle}button,input{line-height:normal}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer;*overflow: visible}button[disabled],html input[disabled]{cursor:default}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0;*height: 13px;*width: 13px}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}html,button,input,select,textarea{color:#222}::-moz-selection{background:#b3d4fc;text-shadow:none}::selection{background:#b3d4fc;text-shadow:none}img{vertical-align:middle}fieldset{border:0;margin:0;padding:0}textarea{resize:vertical}.chromeframe{margin:.2em 0;background:#ccc;color:#000;padding:.2em 0}@font-face{font-family:FangZhengFangSong-GBK-1;src:url(/assets/FangZhengFangSong-GBK-1-5f70b182.woff) format("woff"),url(data:font/ttf;base64,Ym9vawAAAABtYXJrAAAAADgAAAA4AAAAgAMAAAAABBAAAAAAAQAAAB++Ltv+lsRBAAAAAAEAAACsAgAABAAAAAMDAAAABAAADAAAAAEBAABBcHBsaWNhdGlvbnMLAAAAAQEAAEZvbnRtaW4uYXBwAAgAAAABAQAAQ29udGVudHMJAAAAAQEAAFJlc291cmNlcwAAAAYAAAABAQAAYXBwLm53AAAEAAAAAQEAAGRpc3QlAAAAAQEAAEZhbmdaaGVuZ0ZhbmdTb25nLUdCSy0xXzE2NjkxODY5NDQ1MzEAAAAbAAAAAQEAAEZhbmdaaGVuZ0ZhbmdTb25nLUdCSy0xLnR0ZgAgAAAAAQYAABAAAAAkAAAAOAAAAEgAAABcAAAAbAAAAHgAAACoAAAACAAAAAQDAAAj0JgDAAAAAAgAAAAEAwAAp9OFBQAAAAAIAAAABAMAAK7ThQUAAAAACAAAAAQDAACy04UFAAAAAAgAAAAEAwAAs9OFBQAAAAAIAAAABAMAAMjlhQUAAAAACAAAAAQDAADJ5YUFAAAAAAgAAAAEAwAAyuWFBQAAAAAgAAAAAQYAAPQAAAAEAQAAFAEAACQBAAA0AQAARAEAAFQBAABkAQAACAAAAAAEAABBxJb+hEUBZxgAAAABAgAAAQAAAAAAAAAfAgAAAAAAAB8CAAAAAAAAAAAAAAEFAAAIAAAAAQkAAGZpbGU6Ly8vDAAAAAEBAABNYWNpbnRvc2ggSEQIAAAABAMAAAAAhxE5AAAACAAAAAAEAABBw/d7NIAAACQAAAABAQAAQjkxMjU2QkYtNjkwNC00Q0ZFLTkyQzAtQjM1MjMyQTQ5NDlFGAAAAAECAACBAAAAAQAAAO8TAAABAAAA7xMAAAEAAAABAAAAAQEAAC8AAAAzAAAAAQIAAGRuaWIAAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAADAAAAAAAAAHR0Zj8/Pz8AAAAAAAAAAADMAAAA/v///wEAAAAAAAAAEAAAAAQQAADMAAAAAAAAAAUQAAB0AQAAAAAAABAQAACsAQAAAAAAAEAQAACcAQAAAAAAAAIgAABkAgAAAAAAAAUgAADUAQAAAAAAABAgAADkAQAAAAAAABEgAAAYAgAAAAAAABIgAAD4AQAAAAAAABMgAAAIAgAAAAAAACAgAABEAgAAAAAAADAgAADMAQAAAAAAAAHQAADMAQAAAAAAABDQAAAEAAAAAAAAABfwAACoAAAAAAAAACLwAABwAgAAAAAAAA==) format("truetype");font-style:normal;font-weight:400}html,body{width:100vw;height:100vh;font-family:FangZhengFangSong-GBK-1,serif}#app{width:100%;height:100%}.w100{width:100%}.h100{height:100%}.color-wrapper{position:fixed;width:100%;height:100%;background-image:url(/assets/grain-d794feb1.png)}.color-container{max-width:1100px;margin:0 auto;position:relative}.color-container-collapse-btn{display:none;position:fixed;z-index:999;top:1em;left:.9em;padding:.3em;border-radius:50%;border:.17em solid}.color-container-color{position:absolute;top:0;left:0;overflow-y:scroll;width:47%}.color-container-color::-webkit-scrollbar{height:0px;width:0px}.color-container-color::-webkit-scrollbar-track{background-color:transparent}.color-container-color::-webkit-scrollbar-thumb{background-color:transparent;border-radius:0}.color-container-color-item{width:calc(100% - .2em);position:relative;top:3.125em;display:flex;letter-spacing:.1825em}.color-container-color-item-block{width:100%;left:0;padding-bottom:2em;display:flex;flex-wrap:wrap}.color-container-color-item-block div{width:3.2em;writing-mode:vertical-lr;padding:0 0 1em;display:flex;align-items:center;cursor:pointer;letter-spacing:.25em;position:relative}.color-container-color-item-block div span{position:relative;z-index:2;font-size:1em}.color-container-color-item-block div i{display:inline-block;position:absolute;right:1.05em;top:-.125em;width:.375em;height:1.9em;z-index:1;border-radius:.125em}.color-container-color-item-solarterm{writing-mode:vertical-lr;padding-right:2.3em;font-size:1.125em}.color-container-name{position:absolute;top:12vh;right:2em;display:block}.color-container-name-title{font-size:5em;writing-mode:vertical-lr}.color-container-name.active span{opacity:0;animation:show 1.5s ease-out forwards}.color-container-name-rgb{position:absolute;transform:translateY(-10%);top:-1.5em;left:125%;display:flex;flex-direction:column;font-family:cursive}.color-container-name-rgb p{padding-bottom:2.2em;display:flex;align-items:center}.color-container-name-rgb p span:first-child{transform:scale(.65);display:inline-block;position:relative;top:-.7em;left:.1em}.color-container-name-rgb p span:last-child{font-size:1.1em}.color-container-sentence{writing-mode:vertical-rl;position:absolute;bottom:1em;right:2em}.color-container-sentence span.active{opacity:0;animation:show 1.5s linear forwards}.color-container-sentence .sentence{display:block}.color-container-sentence .sentence span{font-size:1.375em}.color-container-sentence .sentenceFrom{padding-right:1.25em}.color-container-sentence .sentenceFrom span:first-child:before{content:"「 ";position:relative;top:.3em}.color-container-sentence .sentenceFrom span:last-child:after{content:" 」";position:relative;bottom:.3em}.color-copyright{writing-mode:vertical-lr;position:absolute;right:.3125em;top:50%;font-size:.875em;opacity:.5;transform:translateY(-50%);letter-spacing:.625em;height:max-content}.color-operate{position:fixed;bottom:.5em;right:.5em;display:flex;cursor:pointer}.color-operate .tooltip{position:relative;font-family:"sans-serif"}.color-operate .tooltip .tooltip-item{visibility:hidden;color:#fff;text-align:center;padding-bottom:10px;position:absolute;z-index:1;bottom:100%;left:50%;transform:translate(-50%);font-size:.625em;opacity:0;transition:opacity 1s;display:flex}.color-operate .tooltip .tooltip-item:after{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);border-width:.5em;border-style:solid;border-color:black transparent transparent transparent}.color-operate .tooltip .tooltip-item p{padding:3px 8px;background-color:#000}.color-operate .tooltip .tooltip-item p:first-child{border-top-left-radius:4px;border-bottom-left-radius:4px}.color-operate .tooltip .tooltip-item p:last-child{border-top-right-radius:4px;border-bottom-right-radius:4px}.color-operate .tooltip .tooltip-item p:not(:last-child){padding-right:1em}.color-operate .tooltip .tooltip-item p:not(:first-child){padding-left:1em}.color-operate .tooltip:hover .tooltip-item{visibility:visible;opacity:1}.color-operate .copyBtn{font-family:"sans-serif";background:#1a0c0c;color:#fff;padding:3px 5px;font-size:.625em;border-radius:4px}@keyframes show{0%{opacity:0}to{opacity:1}}@media screen and (max-width: 780px){.color-container{max-width:100vw;position:relative}.color-container-collapse-btn{display:block}.color-container-color{transition:all .2s;position:fixed;top:4em;left:0;width:3em;transform:translate(-100%);z-index:10}.color-container-color-item{top:0;flex-direction:column;justify-content:center;align-items:center}.color-container-color-item-solarterm{padding-right:0;padding-bottom:1em;font-weight:700;opacity:.7}.color-container-color-item-block{flex-direction:column;justify-content:center;align-items:center}.color-container-color-item-block div{width:1.5em}.color-container-color-item-block div i{right:.25em}.color-container-name{width:100vw;display:flex;justify-content:center;right:0}.color-container-name-rgb{display:none}.color-container-sentence{width:100vw;display:flex;justify-content:center;flex-direction:column;right:0}.color-copyright{display:none}}@media screen and (min-width: 781px) and (max-width: 1500px){.color-container{max-width:75vw;position:relative}}