.tabs{scrollbar-gutter:stable;scrollbar-width:thin;scroll-snap-align:start;scroll-snap-type:x proximity;align-items:end;gap:4px;display:flex;overflow-x:scroll}.tabs,.tab,.new-tab{transform:rotateX(180deg)}.tab:not(.active){border-color:var(--secondary-dull);background-color:var(--primary-dull)}.tab:not(.active) p{color:var(--secondary-bright)}.tab:not(.active) .head button.close{background-color:var(--primary-duller)}.tab:not(.active) .head button.close .icon{color:var(--secondary)}.tab.active{background-color:var(--primary)}.tab.active p{color:var(--secondary-brighter)}.tab.active .head button.close{background-color:var(--primary-dull)}.tab.active .head button.close .icon{color:var(--secondary)}.new-tab{border-color:var(--secondary)}.new-tab,.tab{--border:1px;--head-height:1rem;flex-shrink:0}.new-tab{width:calc(var(--preview-width) + var(--border) * 2);height:calc(var(--preview-height) + var(--head-height));border-width:var(--border) var(--border) 0;border-style:solid solid none;justify-content:center;align-items:center;display:flex}.new-tab button{color:var(--accent);cursor:pointer;background:0 0;border:none;padding:0;font-size:.75rem;text-decoration:underline}.tab{cursor:pointer;width:calc(var(--preview-width) + var(--border) * 2);height:calc(var(--preview-height) + var(--head-height));flex-direction:column;align-items:center;display:flex}.tab .head{width:100%;height:var(--head-height);justify-content:space-between;align-items:start;display:flex}.tab .head p{line-height:var(--head-height);padding-left:.2rem;font-size:.75rem;font-weight:600}.tab .head button.close{width:1rem;height:calc(.8rem - var(--border));justify-content:center;align-items:center;display:flex}.tab .head button.close .icon{font-size:.6rem}:is(.new-tab:has(.palette-preview),.tab:has(.palette-preview)){--preview-width:calc(20px * 3);--preview-height:calc(20px * 2 - 6px)}.palette-preview{width:var(--preview-width);height:var(--preview-height);background-color:var(--primary-duller);flex-flow:wrap-reverse;display:flex;overflow:hidden}.palette-preview.active{background-color:var(--primary-dull)}.palette-preview .color{width:20px;height:20px}.palette .grid .item,.palette .grid .item.header,.palette .grid .item.new,.palette .grid .edit-item{grid-row:span 1;grid-column-end:span 1}.palette .item .rank{--rank-great-main:#8acc5a;--rank-great-dark:#667a00;--rank-good-main:#f3ce62;--rank-good-dark:#a87700;--rank-meh-main:var(--white);--rank-none-main:var(--white)}.palette .item .rank.great{--rank-bg:var(--rank-great-main);--rank-border:.2rem solid var(--rank-great-dark)}.palette .item .rank.good{--rank-bg:var(--rank-good-main);--rank-border:.2rem solid var(--rank-good-dark)}.palette .item .rank.meh{--rank-bg:var(--rank-meh-main);--rank-border:none}.palette .item .rank.none{--rank-bg:var(--rank-none-main);--rank-border:none}.palette .item{background-color:var(--white);flex:1 0 0;align-items:stretch;min-width:9.09rem;max-width:16rem;height:1.36rem;display:flex}.palette .item .rank{background-color:var(--rank-bg);border-left:var(--rank-border);justify-content:flex-end;align-items:center;width:2.4rem;padding-right:.4rem;display:flex}.palette .item .rank p{text-align:right;font-variant-numeric:lining-nums proportional-nums;color:var(--bg);font-size:.8rem;line-height:1}.palette .item .color{border-left:var(--rank-border);flex:1 0 0}.palette .item .feature-color{justify-content:center;align-items:stretch;width:1.25rem;display:flex}.palette .item .feature-color .picked-color-overlay{width:33.3333%}.palette .item button{text-align:center;width:1.36rem;height:1.36rem;color:var(--bg);justify-content:center;align-items:center;display:flex}.palette .item button.edit{background-color:var(--edit)}.palette .item button.copy{background-color:var(--copy)}.palette .item button.delete{background-color:var(--delete)}.palette .item button .icon{font-size:.8rem}.palette .item.header{align-items:flex-end;height:1.2rem;display:flex}.palette .item.header .rank,.palette .item.header .color{align-items:center;height:100%;display:flex}.palette .item.header .rank{text-align:right;justify-content:flex-end;width:2.4rem;padding-right:.4rem}.palette .item.header .color{text-align:left;border-left:.4px solid #c6c6c6;flex:1 0 0;justify-content:flex-start;padding-left:.4rem}.palette .item.header p{color:var(--bg-dull);font-size:.6rem;line-height:1}.palette .item.header .meta{width:5.7rem}.palette .item.new{align-items:center;padding-left:2.4rem}.palette .item.new button{background-color:var(--add);width:fit-content;color:var(--bg);align-items:center;gap:.1rem;padding:0 .3rem 0 .1rem;display:flex}.palette .item.new button p,.palette .item.new button .icon{font-size:.8rem}.palette div:has(.edit-item){container:edit-palette-item-container/inline-size}.palette .edit-item{color:var(--bg);background-color:#fff;grid-template:"preview coords space"minmax(0,1fr)"preview coords other"fit-content(100%)/1.25rem 6.25rem minmax(0,1fr);align-self:stretch;min-width:10rem;max-width:20rem;height:3.2rem;display:grid}@container edit-palette-item-container (inline-size<=15.25rem){.palette .edit-item{grid-template:"space space space space"minmax(0,1fr)"preview coords other."3.2rem/1.25rem minmax(5.55rem,6.25rem) minmax(3.2rem,3.6rem) minmax(0,1fr);height:4.8rem}}.palette .edit-item .preview{grid-area:preview}.palette .edit-item .coords{grid-area:coords}.palette .edit-item .space{grid-area:space}.palette .edit-item .actions-and-warning{grid-area:other}.palette .edit-item .preview{flex-direction:column;align-items:stretch;display:flex}.palette .edit-item .preview .now,.palette .edit-item .preview .prev{height:50%}.palette .edit-item .coords{flex-direction:column;height:3.2rem;display:flex}.palette .edit-item .coords .coord{flex-direction:row;flex:1 0 0;display:flex}.palette .edit-item .coords .coord .label,.palette .edit-item .coords .coord input{align-items:center;font-size:.8rem;line-height:1rem;display:flex}.palette .edit-item .coords .coord .label{text-align:right;background-color:var(--secondary-brighter);width:1.6rem;color:var(--primary);justify-content:end;padding-right:.25rem}.palette .edit-item .coords .coord input{text-align:left;background-color:var(--primary);color:var(--bg);flex:1 0 0;justify-content:start;padding-left:.2rem}.palette .edit-item select.space{background-color:var(--primary);height:1.2rem;color:var(--bg);margin-left:.4rem}@container edit-palette-item-container (inline-size<=15.25rem){.palette .edit-item select.space{margin:0}}.palette .edit-item .actions-and-warning{flex-direction:row;margin-left:.4rem;display:flex}@container edit-palette-item-container (inline-size<=15.25rem){.palette .edit-item .actions-and-warning{flex-direction:column;justify-content:end;margin-left:min(.4rem,100% - 3.2rem)}}.palette .edit-item .actions-and-warning button{justify-content:center;align-items:center;width:3.2rem;height:1.33333rem}.palette .edit-item .actions-and-warning button.submit{background-color:var(--accent);color:var(--primary)}.palette .edit-item .actions-and-warning button.cancel{color:var(--bg);background-color:#f4f4f3}.palette .edit-item .actions-and-warning .out-of-gamut{align-self:stretch;align-items:center;padding-left:.4rem;display:flex}.palette .edit-item .actions-and-warning .out-of-gamut img{width:1rem;height:1rem}.palette .table{max-width:calc(16rem * var(--rows) + .8rem * (var(--rows) - 1) + .2rem * 2);background-color:var(--white);flex-direction:column;align-self:stretch;align-items:stretch;padding:.4rem .2rem .6rem;display:flex}.palette .table .head,.palette .table .body{gap:.8rem;width:100%;display:flex}.palette .table .head{border-bottom:max(.08rem, 1px) solid var(--grey)}.palette .table .body{border-bottom:max(.06rem, 1px) solid var(--grey)}.palette .table .body .row{background-color:var(--grey);flex-direction:column;flex:1 0 0;align-items:stretch;gap:max(.04rem,1px);height:fit-content;display:flex}.palette .table-config{color:var(--secondary);align-items:center;gap:4px;padding:.4rem 0;display:flex}.palette .table-config label,.palette .table-config input{color:var(--secondary);align-items:center;font-size:.8rem;line-height:1.2rem;display:flex}.palette .table-config label{gap:.2rem}.palette .table-config input{text-align:left;background-color:var(--white);justify-content:start;padding-left:.2rem}.palette{background-color:var(--primary);flex-direction:column;align-items:flex-start;width:95vw;padding:0 12px;display:flex}.palette .dev{background-color:var(--primary-dull);flex-direction:column;align-items:flex-start;width:100%;margin:2.4rem 0 .6rem;padding:.4rem;display:flex}.palette .dev p{color:var(--bg);margin:0;font-size:.72rem;font-weight:500;line-height:1.4}.palette .dev .inputs{grid-template-rows:fit-content(100%) fit-content(100%) fit-content(100%);grid-template-columns:fit-content(100%) fit-content(100%) fit-content(100%);grid-auto-flow:column;gap:.2rem .6rem;margin-top:.8rem;display:grid}.palette .dev .inputs button{width:fit-content;height:fit-content;padding:0 .2rem;font-size:.8rem;line-height:1.25}.palette .dev .inputs label{color:var(--bg);flex-direction:row;align-items:center;gap:.2rem;font-size:.72rem;font-weight:500;line-height:1rem;display:flex}.palette .dev .inputs label a{color:var(--accent)}.palette .dev .inputs input{grid-row:span 3;width:4rem;height:100%}.app>.dev{background-color:var(--bg-dull);color:var(--primary-dull);flex-direction:row;gap:.6rem;width:95vw;margin-top:.8rem;padding:.2rem .4rem;font-weight:500;display:flex}.app>.dev .row p{text-wrap:pretty;font-size:.72rem;line-height:1.4}.app>.dev .row.jp p{line-height:1.6}.app>.dev .row p:not(:first-child){text-indent:1em}*,:before,:after{box-sizing:border-box;background-repeat:no-repeat}:before,:after{-webkit-text-decoration:inherit;text-decoration:inherit;vertical-align:inherit}:where(:root){cursor:default;overflow-wrap:break-word;tab-size:4;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;line-height:1.5}:where(body){margin:0}:where(h1){margin:.67em 0;font-size:2em}:where(dl,ol,ul) :where(dl,ol,ul){margin:0}:where(hr){color:inherit;height:0}:where(nav) :where(ol,ul){padding:0;list-style-type:none}:where(nav li):before{content:"​";float:left}:where(pre){font-family:monospace;font-size:1em;overflow:auto}:where(abbr[title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}:where(b,strong){font-weight:bolder}:where(code,kbd,samp){font-family:monospace;font-size:1em}:where(small){font-size:80%}:where(audio,canvas,iframe,img,svg,video){vertical-align:middle}:where(iframe){border-style:none}:where(svg:not([fill])){fill:currentColor}:where(table){border-collapse:collapse;border-color:inherit;text-indent:0}:where(button,input,select){margin:0}:where(button,[type=button i],[type=reset i],[type=submit i]){-webkit-appearance:button}:where(fieldset){border:1px solid #a0a0a0}:where(progress){vertical-align:baseline}:where(textarea){resize:vertical;margin:0}:where([type=search i]){-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}:where(dialog){color:#000;background-color:#fff;border:solid;width:fit-content;height:fit-content;margin:auto;padding:1em;position:absolute;left:0;right:0}:where(dialog:not([open])){display:none}:where(details>summary:first-of-type){display:list-item}:where([aria-busy=true i]){cursor:progress}:where([aria-controls]){cursor:pointer}:where([aria-disabled=true i],[disabled]){cursor:not-allowed}:where([aria-hidden=false i][hidden]){display:initial}:where([aria-hidden=false i][hidden]:not(:focus)){clip:rect(0, 0, 0, 0);position:absolute}@font-face{font-family:Atkinson Hyperlegible Next;font-weight:200 800;font-style:normal;font-variant-numeric:lining-nums proportional-nums;src:url(/assets/AtkinsonHyperlegibleNext-VariableFont_wght-CEpLVe_v.ttf)format("truetype")}@font-face{font-family:Atkinson Hyperlegible Next;font-weight:200 800;font-style:italic;src:url(/assets/AtkinsonHyperlegibleNext-Italic-VariableFont_wght-DtWedsAp.ttf)format("truetype")}@font-face{font-family:Questrial;font-weight:400;font-style:normal;src:url(/assets/Questrial-Regular-BGISleCW.ttf)format("truetype")}@font-face{font-family:Material Icons;font-weight:400;font-style:normal;src:url(/assets/MaterialIconsOutlined-Regular-C9WY0n77.otf)format("opentype")}:root{--brown-100:#fff8e5;--brown-200:#d5c8ae;--brown-300:#ad9a7a;--brown-400:#9a8361;--brown-500:#876d49;--brown-600:#755731;--brown-700:#634217;--brown-800:#3d2412;--brown-900:#1d0d08;--deep-green:#1c6c00;--white:#fff;--blue:#76b9e8;--yellow:#ecc800;--green:#86c23c;--red:#fa793a;--grey:#595959;--primary:var(--brown-100);--primary-dull:var(--brown-200);--primary-duller:var(--brown-300);--bg:var(--brown-900);--bg-dull:var(--brown-800);--secondary-brighter:var(--brown-500);--secondary-bright:var(--brown-600);--secondary:var(--brown-700);--secondary-dull:var(--brown-800);--accent:var(--deep-green);--add:var(--blue);--delete:var(--red);--edit:var(--yellow);--copy:var(--green);--text:var(--primary);--sans:"Atkinson Hyperlegible Next", Verdana;--heading:"Questrial", Verdana;--mono:"Atkinson Hyperlegible Next", monospace;box-sizing:border-box;font:18px/145% var(--sans);letter-spacing:.18px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}@media (width<=1024px){:root{font-size:16px}}:root{width:100vw}body{margin:0}#root{text-align:left;border-inline:1px solid var(--border);box-sizing:border-box;flex-direction:column;width:100vw;max-width:100%;min-height:100svh;margin:0 auto;display:flex}h1,h2{font-family:var(--heading);font-weight:500}h2{margin:0 0 -2px;padding:0;font-size:1.25em;line-height:1.5em}p{margin:0}code{font-family:var(--mono);color:var(--text-h);background:var(--code-bg);display:inline-flex}input,select,button{font-family:var(--sans);border:none;margin:0;padding:0}button{cursor:pointer}.icon{text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;font-family:Material Icons;font-size:24px;font-style:normal;font-weight:400;line-height:1;display:inline-block}