*{padding:0;margin:0;box-sizing:border-box}:root{--font-primary:24px;--temp-color:transparnt;--sample-top:40px;--sample-left:0;--text-color: #000;--background-color:#eee;--form-bodercolor:#ccc}@media (prefers-color-scheme: light){:root{--text-color: #000;--background-color:#eee;--form-bodercolor:#ccc}}@media (prefers-color-scheme: dark){:root{--text-color: #fff;--background-color:#2e2827;--form-bodercolor:#000}::-webkit-scrollbar{width:12px;height:12px}::-webkit-scrollbar-track{background:var(--form-bodercolor);box-shadow:inset 0 0 2px #777}::-webkit-scrollbar-thumb{background:var(--text-color);border-radius:16px}}#help{display:flex;flex:1;justify-content:flex-end;padding-right:0;margin-right:0}#help button{padding-right:0;margin-right:0}header{position:fixed;z-index:2;width:100%;padding:8px 16px;background:var(--background-color);font-size:12px;color:var(--text-color)}header #new_file{display:grid;justify-items:center;align-items:center;border-bottom:0.5px solid var(--form-bodercolor)}header #new_file button{margin:16px 0}header h1{margin-right:24px;margin-left:0px}header ul{list-style:none;display:flex}header ul li:not(:first-child){border-right:1px solid var(--form-bodercolor);margin-right:16px}header button{background:var(--background-color);color:var(--text-color);display:inline-block;border:none;text-decoration:underline;margin-right:16px}header input[type="color"]{background:transparent;border:none;width:20px;height:24px;padding:0}header #replace{display:flex}header #replace input[type=text]{vertical-align:top;width:80px;margin-top:0px}header #replace input[type=color]{margin-top:-2px}header #replace>span{vertical-align:bottom;margin-top:2px}header #replace button{background:var(--background-color);color:var(--text-color);margin:-2px 16px 0 4px}label{margin-top:2px;font-size:14px}input[type="file"],input[type=checkbox]{display:none}input[type=number]{width:44px;padding:0px 0;text-align:right}var{font-style:normal;display:inline-block;width:32px;text-align:right}nav div{background:#fff;width:var(--font-primary);height:var(--font-primary);line-height:var(--font-primary);text-align:center}#all{margin-top:40px;padding:16px;position:relative}.split_bottom_line{padding-bottom:8px;border-bottom:1px solid #ccc}#draw_type img:nth-of-type(2){display:none}#draw_type input:checked ~ img:nth-of-type(2){display:inline-block}#draw_type input:checked ~ img:nth-of-type(1){display:none}#history{margin:16px 16px 0px 32px;display:grid;grid-template-columns:repeat(8, 1fr);list-style:none}#history:empty{height:31px}#history li{font-size:12px;line-height:24px}#history li span{display:inline-block;width:24px;height:24px;margin-right:4px;border:0.5px solid #ccc}#history var{font-size:16px;line-height:24px;text-align:left;margin:0}samp{display:grid;width:100%;height:auto;opacity:.3;z-index:-1;position:absolute;justify-items:center;align-items:center}samp #base{margin-top:var(--sample-top);margin-left:var(--sample-left);background-repeat:no-repeat;background-size:contain;display:grid}main{padding:16px;display:grid;justify-items:center;align-items:center}main nav{display:flex;padding-left:12px;width:auto}#main{counter-reset:rowCount}#main li{display:flex;width:auto;counter-increment:rowCount}#main li div:first-child{width:--font-primary}#main>li::before{line-height:var(--font-primary);content:counter(rowCount);height:var(--font-primary);padding-right:4px;margin-right:2px;text-align:right;text-align:center;width:calc(var(--font-primary) + 4px);background:#fff;display:inline-block;border:none}#main div{border:0.2px solid #000;border-bottom:none;border-right:none;text-align:center;width:var(--font-primary);height:var(--font-primary);line-height:var(--font-primary);text-align:center}#main.base li div:nth-child(5n+1),#main.forcapture li div:nth-child(5n+2){border-left:2px solid #000}#main li:nth-child(5n) div{border-bottom:1px solid #000}#main div:last-child{border-right:2px solid #000}#main li:first-child div{border-top:2px solid #000}#main li:last-child div{border-bottom:2px solid #000}.dropper{cursor:url(../img/dropper.svg) 4 20,pointer}.line_start{position:relative}.line_start:before{animation:flash 1.5s linear infinite;content:"";background:var(--temp-color);position:absolute;top:0;left:0;width:calc(var(--font-primary) - 2px);height:calc(var(--font-primary) - 2px);border-radius:50%}footer{background:var(--background-color);position:fixed;display:flex;bottom:0px;padding:0px 8px 2px 72px;z-index:1;width:100%;overflow-x:scroll;scrollbar-base-color:var(--background-color)}footer div{flex-wrap:nowrap;display:block;width:20px;height:24px;flex-shrink:0;border-top:0.2px solid #000;border-bottom:0.2px solid #000;border-right:0.2px solid #000}.inactive{position:relative}.inactive span{position:absolute;top:0;left:0;width:27px;height:27px;border:1px solid #f00;background:linear-gradient(-45deg, transparent 0%, transparent 48%, #d40000 48%, #d40000 52%, transparent 52%, transparent 100%)}.switch{position:relative}.switch span{position:absolute;top:0;left:0;width:27px;height:27px;border:1px solid #f00;background:linear-gradient(-45deg, transparent 0%, transparent 48%, #d40000 48%, #d40000 52%, transparent 52%, transparent 100%)}.switch input:checked ~ span{display:none}aside{background:var(--background-color);position:fixed;margin-top:36px;margin-bottom:44px;height:100vh;left:0;z-index:2;padding:16px;width:56px;align-items:center}aside button img,aside label img{align-self:center;margin:0 auto}aside svg{color:var(--text-color)}aside button{background:transparent;border:none;display:inline;margin:0;padding:0}aside ul li{position:relative;display:flex;justify-items:center;align-items:center;margin-bottom:6px;width:100%}aside li:hover p{display:inline-block}aside li p{position:absolute;color:#fff;background:#000;padding:8px;top:0;width:calc(100% + 160px);left:40px;font-size:12px;border-radius:8px;z-index:3;display:none}aside li p:before{content:"";position:absolute;top:10px;left:-14px;border:8px solid transparent;border-right:12px solid #000;margin-left:0px;z-index:2}aside button,aside input,aside label{align-self:center;margin:0 auto}aside #colors{position:relative}aside #color{background:transparent;width:24px;height:28px;z-index:1;position:absolute;top:0px;left:-6px;padding:0;border:none;margin:0}aside #bgcolor{background:transparent;margin:8px 0 0 8px;width:24px;height:28px;border:none}aside #color_none{position:absolute;top:4px;left:-4px;width:20px;height:20px;border:1px solid #f00;background:linear-gradient(-45deg, transparent 0%, transparent 48%, #d40000 48%, #d40000 52%, transparent 52%, transparent 100%);z-index:2}aside #bg_none{position:absolute;top:0px;left:0px;width:20px;height:20px;margin:12px 0 0 10px;border:1px solid #f00;background:linear-gradient(-45deg, transparent 0%, transparent 48%, #d40000 48%, #d40000 52%, transparent 52%, transparent 100%);z-index:0}dialog{box-sizing:border-box;position:fixed;inset:0;margin:auto;border:none}dialog #tips{margin:0;display:block;width:800px;padding:0px 0px 32px 0px}dialog #tips p{margin:16px 0}dialog #tips h1{text-align:center;display:flex}dialog #tips h1 span{margin-top:8px;display:block;flex:1}dialog #tips h2{font-size:90%;margin:16px}dialog #tips ul{flex-direction:column;height:90%;margin:0 16px;list-style:none;width:auto;border-top:1px solid #ddd;border-right:1px solid #ddd;border-left:1px solid #ddd}dialog #tips ul li{display:flex;border-bottom:1px solid #ddd;padding:0px;margin:0}dialog #tips ul li b{text-align:center;display:inline-block;width:300px;margin-right:16px;border-right:1px solid #ddd}dialog #tips #credit{text-align:right}dialog section{box-sizing:border-box;align-self:center;margin:auto;border:0.5px solid #000;border-radius:0px 0px 4px 4px}dialog h1{font-size:16px;flex:1;text-align:center;padding:8px}dialog article{border-radius:4px 4px 0px 0px;display:flex;background:#000;color:#fff}dialog article button{background:transparent;border:none;color:#fff;width:30px;height:30px;font-size:24px;margin:3px 6px 0 0;transform:rotate(45deg)}dialog ul#candidates{list-style:none;display:flex}dialog ul#candidates li{flex:1;text-align:center;margin:16px 0}dialog ul#candidates li button{display:block;width:100%;height:32px;border:none;text-align:center;background:none}dialog ul#candidates li:last-of-type{border-left:0.5px solid #000}dialog p{padding:16px;word-break:break-all}@keyframes flash{0%,
	100%{opacity:1}50%{opacity:0}}
/*# sourceMappingURL=dev.css.map */