:root,button,input,select{font-family:Helvetica Neue,Arial,Hiragino Kaku Gothic ProN,Hiragino Sans,Meiryo,sans-serif;font-size:min(3.2vw,1.6vh,16px);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:root{color-scheme:dark;--text-color: light-dark(black, white);--active-text-color: light-dark(white, black);--disabled-text-color: #808080;--background-color: light-dark(#e0e0e0, #202020);--message-background-color: light-dark(#c0ffc0, #406040);--canvas-color: darkgray;--border-color: light-dark(#606060, #a0a0a0);--button-color: light-dark(#b0b0b0, #505050);--active-button-color: light-dark(#989898, #686868);--radio-color: light-dark(#d0ac70, #906010);--input-color: light-dark(#f0f0f0, #101010);--highlight-color: light-dark(#c07800, #ffa000);--error-color: light-dark(#ffa0a0, #c04040);--informations-color: light-dark(#ffffa0, #606000);--transition-duration: 0s;--sight-delay: 0s}:root:has(#app.ok){--transition-duration: .2s;--sight-delay: 1s}:root:has(#app.light){color-scheme:light}*{box-sizing:border-box;overscroll-behavior:none;touch-action:none;-webkit-user-drag:none;-webkit-tap-highlight-color:transparent}:not(input[type=text]){-webkit-user-select:none;user-select:none}html,body{margin:0;height:100%}#app{position:relative;width:100%;height:100%;background-color:var(--background-color);overflow:hidden;transition:background-color var(--transition-duration)}#sight{position:absolute;top:calc(12.3125rem * -.8535534);right:calc(12.3125rem * -.8535534);width:12.3125rem;height:12.3125rem;background-color:var(--background-color);border:solid .0625rem var(--border-color);z-index:9999;border-top-left-radius:50%;border-bottom-left-radius:50%;border-bottom-right-radius:50%;overflow:hidden;transition:top var(--transition-duration) ease-out,right var(--transition-duration) ease-out}#sight>div{position:absolute;inset:1rem;background-color:var(--canvas-color);border:solid .0625rem var(--border-color);border-radius:50%;overflow:hidden}#sight>div>canvas{position:absolute;width:100%;height:100%;inset:0}#sight.show{top:-.0625rem;right:-.0625rem}#frame{padding:1rem;width:100%;height:100%;display:grid;grid-template-columns:100%;grid-template-rows:max-content max-content max-content max-content minmax(0,1fr);gap:1rem;overflow:hidden}#frame button,#frame label:has(>input[type=file]),#frame label:has(>input[type=radio]){flex-grow:1}#frame>#head{flex-shrink:0;display:flex;flex-direction:row;align-items:end;flex-wrap:wrap;gap:1rem}#frame>#head>#top{flex-grow:0;width:100%;display:flex;justify-content:space-between;gap:1rem}#frame>#head>#top>div:has(>h1){max-width:7.25rem;display:flex;flex-direction:row-reverse;align-items:center;gap:.5rem}#frame>#head>#top>div:has(>h1)>h1{margin:0;font-size:1.5rem;color:var(--text-color);transition:color var(--transition-duration) ease-in-out}#frame>#head>#top>div:has(>h1)>button{padding:.5rem!important}#frame>#head>#top #size{flex-grow:1;align-self:stretch;display:flex;justify-content:center;align-items:stretch;gap:1rem}#frame>#head>#top #size>button{flex:1 1 3.125rem;padding:0;max-width:7.25rem;height:3.125rem;display:grid;grid-template-columns:2rem 1rem 2rem;grid-template-rows:1rem 1.5rem;place-content:center;place-items:center}#frame>#head>#top #size>button>div{text-align:center;white-space:nowrap}#frame>#head>#top #size>button>div:nth-child(1),#frame>#head>#top #size>button>div:nth-child(2),#frame>#head>#top #size>button>div:nth-child(3),#frame>#head>#top #size>button>div:nth-child(5){font-size:1rem}#frame>#head>#top #size>label{flex:1 1 3.125rem;position:relative;padding:0 .3125rem;max-width:7.25rem;height:3.125rem;display:grid;grid-template-rows:1rem 1.5rem;grid-template-columns:1fr;place-content:center;align-items:center}#frame>#head>#top #size>label>div{z-index:1;pointer-events:none}#frame>#head>#top #size>label>select{position:absolute;-webkit-appearance:none;appearance:none;padding:1rem .25rem 0 0;inset:0;line-height:1;direction:rtl}#frame>#head>#top>#config,#frame>#head>#top>#screen,#frame>#head>#top>#modifier{flex-grow:0;padding:.5rem!important}#frame>#head>button.menu-button{margin-bottom:-.5rem;padding-bottom:1.0625rem;border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:none}#frame>#head>button.menu-button:disabled{margin-bottom:-.5625rem;padding-bottom:1.125rem;z-index:1;background-color:var(--background-color)}#frame>div.menu{margin:-.5rem;padding:.4375rem;border-radius:.5rem;border:solid .0625rem var(--border-color);display:flex;gap:1rem}#frame>div.menu:not(.show){display:none}button,select,label:has(>input[type=file]),label:has(>input[type=radio]),label:has(>input[type=checkbox]),input[type=text]{color:var(--text-color);background-color:var(--button-color);border:solid .0625rem var(--border-color);border-radius:.25rem;font-size:1.5rem!important;white-space:nowrap;display:inline-grid;place-items:center;transition:color var(--transition-duration) ease-in-out,background-color var(--transition-duration) ease-in-out,border-color var(--transition-duration) ease-in-out}:is(button,select,label:has(>input[type=file]),label:has(>input[type=radio]),label:has(>input[type=checkbox]),input[type=text])>input[type=file],:is(button,select,label:has(>input[type=file]),label:has(>input[type=radio]),label:has(>input[type=checkbox]),input[type=text])>input[type=radio],:is(button,select,label:has(>input[type=file]),label:has(>input[type=radio]),label:has(>input[type=checkbox]),input[type=text])>input[type=checkbox]{display:none}label:has(>input[type=radio]){background-color:var(--radio-color)}label:has(>input[type=radio]:checked),label:has(>input[type=checkbox]:checked){color:var(--active-text-color)!important;background-color:var(--highlight-color)!important}label:has(>input[type=radio]:disabled),label:has(>input[type=checkbox]:disabled){display:none}button,select,label:has(>input[type=file]),label:has(>input[type=radio]){cursor:pointer}option{color:var(--text-color);background-color:var(--background-color)}svg{width:2rem;height:2rem;pointer-events:none}label>input[type=text]{border-radius:.25rem;border:solid .0625rem var(--border-color)}button,label:has(>input[type=file]),label:has(>input[type=radio]){padding:.5rem 0}button:active:not(:disabled),label:has(>input[type=file]:active:not(:disabled)),label:has(>input[type=radio]:active:not(:disabled)),label:has(>input[type=checkbox]:active:not(:disabled)){color:var(--active-text-color)!important;background-color:var(--active-button-color)!important}button:disabled{color:var(--disabled-text-color);background-color:transparent;cursor:default}.error{background-color:var(--error-color)!important}.informations{background-color:var(--informations-color)!important}#modes{flex-shrink:0;display:flex;justify-content:stretch;align-items:stretch;gap:1rem}#modes label:has(>input[type=radio]){flex:1 1 2rem}#palette{position:relative;place-self:center;max-width:100%;max-height:100%;width:fit-content;height:fit-content;background-color:var(--canvas-color)}#palette>canvas{display:block;max-width:100%;max-height:100%}#palette>.box{transition:color var(--transition-duration) ease-in-out,background-color var(--transition-duration) ease-in-out}#palette>.box>div{font-size:1.25rem;display:grid;place-items:center}div:has(>div>div>div>div>#canvas){place-self:stretch;width:100%;height:100%;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:1fr 1.5rem;gap:.5rem}div:has(>div>div>div>div>#canvas)>#bar{width:100%;height:100%;display:flex;flex-wrap:wrap;gap:.5rem;overflow:hidden}div:has(>div>div>div>div>#canvas)>#bar>#message{display:none;cursor:pointer}div:has(>div>div>div>div>#canvas)>#bar>#message.done{background-color:var(--message-background-color)}div:has(>div>div>div>div>#canvas)>#bar>#message.show,div:has(>div>div>div>div>#canvas)>#bar>#coordinate{flex-grow:1;padding:0 .25rem;height:1.5rem;z-index:9999;line-height:1;white-space:nowrap;border-radius:.25rem;border:solid .0625rem var(--border-color);display:flex;align-items:center}div:has(>div>div>div>div>#canvas)>#bar>#options{display:none;gap:.5rem}div:has(>div>div>div>div>#canvas)>#bar>#options>label{padding:0 .25rem;height:1.5rem;font-size:1rem!important;line-height:1}div:has(>div>div>div>div>#canvas)>#bar>#options:has(>label>input[type=checkbox]:not(:disabled)){display:flex}div:has(>div>div>div>div>#canvas)>#bar>#message.show~#coordinate{display:none!important}div:has(>div>div>div>#canvas){border-radius:.5rem;overflow:hidden}div:has(>div>div>#canvas){grid-column:1 / 3;width:100%;height:100%;overflow:auto;background-color:var(--canvas-color)}div:has(>div>#canvas){position:relative;width:100%;height:100%;min-width:fit-content;min-height:fit-content;padding:2rem;overflow:hidden}div:has(>#canvas){width:100%;height:100%;min-width:fit-content;min-height:fit-content;display:grid;place-items:safe center}#canvas{display:block}.box{position:absolute;border:solid .25rem black}.box>div{margin:-.25rem;width:calc(100% + .5rem);height:calc(100% + .5rem);background-image:repeating-linear-gradient(0deg,white,white .25rem,transparent .25rem,transparent .5rem,white .5rem),repeating-linear-gradient(90deg,white,white .25rem,transparent .25rem,transparent .5rem,white .5rem),repeating-linear-gradient(180deg,white,white .25rem,transparent .25rem,transparent .5rem,white .5rem),repeating-linear-gradient(270deg,white,white .25rem,transparent .25rem,transparent .5rem,white .5rem);background-size:.25rem calc(100% + .5rem),calc(100% + .5rem) .25rem,.25rem calc(100% + .5rem),calc(100% + .5rem) .25rem;background-position:0 0,0 0,100% 0,0 100%;background-repeat:no-repeat;animation:borderAnimation 1s infinite linear}@keyframes borderAnimation{0%{background-position:0 0,-.5rem 0,100% -.5rem,0 100%}to{background-position:0 -.5rem,0 0,100% 0,-.5rem 100%}}dialog{padding:0;background:transparent;border:none;overflow:visible}dialog>div,dialog>iframe{margin:0rem;width:100%;height:100%;border-radius:.25rem;background-color:var(--background-color);border:solid .0625rem var(--border-color);overflow:hidden;transition:background-color var(--transition-duration) ease-in-out,border-color var(--transition-duration) ease-in-out}dialog>iframe{display:block}#help-dialog{width:100%;height:100%}#help-dialog>button{position:absolute;top:.5rem;right:.5rem;width:3.125rem;height:3.125rem}#size-dialog{height:100%}#size-dialog>div{padding:1rem;width:auto;display:grid;grid-template-columns:max-content max-content max-content max-content max-content;align-items:stretch;gap:2rem}#size-dialog>div>div{display:flex;flex-direction:column;justify-content:center;align-items:end;gap:1rem}#size-dialog>div>div>label{white-space:nowrap;vertical-align:middle;cursor:pointer}#size-dialog>div>div>label>input[type=text]{padding-right:.5rem;text-align:right;background:var(--input-color)}#size-dialog>div>div>label>input[type=text],#size-dialog>div>div>button{padding:0;width:4.125rem;height:3.125rem}#size-dialog>div>div>.ratio{font-size:1.5rem}#size-dialog>div>div#size-reset{justify-content:space-between}#size-dialog>div>div#size-reset>button{align-self:self-start;width:3.125rem;height:3.125rem}#size-dialog>div>input[type=range]{margin-left:-1rem;width:1rem;writing-mode:vertical-lr;direction:rtl;appearance:none;background:var(--button-color);border:.0625rem solid var(--border-color);border-radius:.5rem;cursor:pointer}#size-dialog>div>input[type=range]::-webkit-slider-runnable-track{margin:-.5rem}#size-dialog>div>input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:2rem;height:2rem;border:.0625rem solid var(--border-color);border-radius:1rem;background:var(--highlight-color)}#size-dialog>div>input[type=range]::-moz-range-track{margin:-.5rem}#size-dialog>div>input[type=range]::-moz-range-thumb{width:2rem;height:2rem;border:.0625rem solid var(--border-color);border-radius:1rem;background:var(--highlight-color)}#modifier-dialog>div{padding:1rem;height:auto;display:flex;flex-direction:column;gap:3rem}#modifier-dialog>div>div{display:grid;grid-template-columns:max-content max-content max-content 6.125rem;justify-content:stretch;align-items:center}#modifier-dialog>div>div>label{color:var(--text-color);transition:color var(--transition-duration) ease-in-out;display:grid;align-items:center;cursor:pointer}#modifier-dialog>div>div>label.left{justify-items:start;padding-left:.5rem}#modifier-dialog>div>div>label.right{justify-items:end;padding-right:.5rem}#modifier-dialog>div>div>input[type=checkbox]{-webkit-appearance:none;appearance:none;display:inline-block;vertical-align:middle;position:relative;width:4rem;height:2rem;border-radius:1rem;border:solid .125rem var(--disabled-text-color);cursor:pointer;transition:border-color var(--transition-duration) ease-in-out}#modifier-dialog>div>div input[type=checkbox]:checked{border-color:var(--highlight-color)}#modifier-dialog>div>div input[type=checkbox]:after{content:"";position:absolute;top:50%;left:.125rem;transform:translateY(-50%);width:1.5rem;height:1.5rem;border-radius:.75rem;background-color:var(--disabled-text-color);transition:left var(--transition-duration) ease-in-out,background-color var(--transition-duration) ease-in-out}#modifier-dialog>div>div input[type=checkbox]:checked:after{left:2.125rem;background-color:var(--highlight-color)}#modifier-dialog>div>div>button{margin-left:3rem;align-self:stretch;height:3.125rem;font-size:1rem!important}#modifier-dialog>div>select{width:auto;height:3.125rem}#modifier-dialog>div>button{align-self:stretch;height:3.125rem;font-size:1rem!important}#config-dialog>div{padding:1rem;height:auto;display:flex;flex-direction:column;gap:1rem}#config-dialog>div>button{align-self:end;width:3.125rem;height:3.125rem}#config-dialog>div>div{display:flex;flex-direction:column;gap:1rem}#config-dialog>div>div>div:first-child{display:grid;grid-template-columns:max-content max-content max-content;grid-template-rows:max-content max-content max-content;justify-content:stretch;align-items:stretch;gap:1rem 0}#config-dialog>div>div>div:first-child>label{color:var(--text-color);transition:color var(--transition-duration) ease-in-out;display:grid;align-items:center;cursor:pointer}#config-dialog>div>div>div:first-child>label.left{justify-items:start;padding-left:.5rem}#config-dialog>div>div>div:first-child>label.right{justify-items:end;padding-right:.5rem}#config-dialog>div>div>div:first-child>input[type=checkbox]{-webkit-appearance:none;appearance:none;display:inline-block;vertical-align:middle;position:relative;width:4rem;height:2rem;border-radius:1rem;border:solid .125rem var(--disabled-text-color);cursor:pointer;transition:border-color var(--transition-duration) ease-in-out}#config-dialog>div>div>div:first-child input[type=checkbox]:checked{border-color:var(--highlight-color)}#config-dialog>div>div>div:first-child input[type=checkbox]:after{content:"";position:absolute;top:50%;left:.125rem;transform:translateY(-50%);width:1.5rem;height:1.5rem;border-radius:.75rem;background-color:var(--disabled-text-color);transition:left var(--transition-duration) ease-in-out,background-color var(--transition-duration) ease-in-out}#config-dialog>div>div>div:first-child input[type=checkbox]:checked:after{left:2.125rem;background-color:var(--highlight-color)}#config-dialog>div>div>div:last-child{display:flex;flex-direction:column;justify-content:end;gap:1rem}#config-dialog>div>div>div:last-child>button{align-self:stretch;padding:0 1rem;width:auto;height:3.125rem;font-size:1rem!important}#help-dialog::backdrop,#size-dialog::backdrop,#config-dialog::backdrop{background-color:#000000bf}@media (orientation: landscape){:root,button,input,select{font-size:min(1.6vw,3.2vh,16px)}#sight{top:unset;right:unset;border-bottom-left-radius:unset;bottom:calc(12.3125rem * -.8535534);left:calc(12.3125rem * -.8535534);border-top-right-radius:50%;transition:bottom var(--transition-duration) ease-out,left var(--transition-duration) ease-out}#sight.show{top:unset;right:unset;bottom:-.0625rem;left:-.0625rem}#frame{grid-template-columns:max-content max-content max-content max-content minmax(0,1fr);grid-template-rows:100%}#frame>#head>button.menu-button{margin-bottom:unset!important;margin-right:-.5rem;padding-bottom:unset!important;padding-right:1.0625rem;border-top-right-radius:0;border-bottom-left-radius:.25rem;border-bottom:solid .0625rem var(--border-color)!important;border-right:none}#frame>#head>button.menu-button:disabled{margin-right:-.5625rem;padding-right:1.125rem;background-color:var(--background-color)}#head,#head>div,#size,.menu,#modes{flex-direction:column!important}#head,#head>div,#modes{align-items:end!important}#top{width:auto!important;margin-bottom:-12.375rem}#top #config,#top #screen,#top #modifier{margin-right:4.125rem}button,label:has(>input[type=file]),label:has(>input[type=radio]){padding:0 .5rem}#config-dialog>div>div{flex-direction:row}.portrait-only{display:none}}@media (orientation: portrait){.landscape-only{display:none}}@media (display-mode: fullscreen){#app:not(.fullscreen) #screen{visibility:hidden}}