body{margin:0 auto;width:100%;min-width:310px;background-color:#eee;user-select:none;cursor:default;font-family:sans-serif}.header{width:100%;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items:center;text-align:center}.header .menu{padding:5px 10px;display:inline-block}.menu .title{font-weight:700}.menu span{font-size:16px}.menu select{font-size:16px;background-color:#eee;border:dashed #000 1px;width:min-content;height:25px}.menu input{margin:0}.workspace{margin:auto;width:300px;height:150px;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;-webkit-justify-content:space-around;justify-content:space-around;-webkit-align-items:center;align-items:center}.workspace .col{margin:10px;display:inline-block}.workspace .col .dict{font-size:96px}.workspace .col .row{height:50px}.workspace .col .row .q{font-size:36px}.workspace .col .row .btn{display:inline-block;font-size:32px}.workspace .col .row input{width:75px;font-size:36px;border:solid #eee;border-bottom:dashed #000;background-color:#eee;-webkit-appearance:none;border-radius:0;display:inline;text-transform:capitalize;padding:0}.workspace .col .row input:hover{border-bottom:solid #111}.keyboard{text-align:center;margin:20px auto}.keyboard .keys{margin:10px auto;width:680px;position:absolute;left:0;right:0;z-index:2;opacity:.2}.keyboard .keys .row-2{margin-left:33px}.keyboard .keys .row-3{margin-left:65px}.keyboard .keys .key{width:64.5px;height:64.5px;float:left}.keyboard .keys .key.answer{background-color:#070}.keyboard .keys .key.pressed{background-color:#02b9ff}.keyboard .pic{width:100%;min-width:310px;max-width:700px;z-index:1;filter:invert(.07);margin:auto;left:0;right:0;position:absolute}.keyboard .pic-placeholder{height:300px}@media screen and (min-width:0\0) and (min-resolution:+72dpi){.keyboard .pic{filter:none}}.keyboard .tips{width:60%;max-width:700px;min-width:300px;margin:auto;font-size:12px;color:#777}.keyboard .tips .line{text-align:center;font-weight:700;color:#333;margin:5px}.manual{width:50%;min-width:230px;text-align:center;margin:20px auto}.manual p{color:#333;font-size:14px;margin:5px;display:inline-block}.footer{margin:20px auto;width:100%}.wx{min-width:160px;position:relative;float:right;right:20px;z-index:1}.wx #wx-title{font-weight:700;font-style:italic;font-size:14px;color:#777}.wx #wx-name{font-weight:700;color:#319a31;margin-left:0}.wx #wx-qr{position:fixed;bottom:20px;right:20px;width:250px;height:250px;border:dashed #777 1px;z-index:1}.copyright{min-width:250px;position:relative;float:left;left:25px;text-align:left;margin-bottom:20px}.copyright span{font-size:14px;color:#777}.copyright a{font-size:12px;color:#888;font-style:italic}.pays{clear:both}.pays .pay-title{margin-left:25px;font-weight:700;color:#777}.pays .pay-name{font-weight:700;margin-left:10px}.pays #alipay{color:#0087ff}.pays #wxpay{color:#319a31}.pays img{position:fixed;bottom:20px;left:20px;width:250px;height:250px;border:dashed #777 1px;z-index:1}.dark-mode{background-color:#333}.dark-mode *{background-color:#333!important;color:#ccc!important}.dark-mode .workspace .col .row input{border:solid #333;border-bottom:dashed #ccc}.dark-mode .keyboard .pic{filter:invert(.8)}.dark-mode .keyboard .keys .key.answer{background-color:#7f7!important}.dark-mode .keyboard .keys .key.pressed{background-color:#ffec02!important}