:root{--naming-gutter:clamp(20px, 6vw, 96px);--pp:var(--paper);--pp-text:var(--black)}body{color:var(--black);background:var(--paper);font:17px/1.55 var(--font-text);margin:0}[hidden]{display:none!important}.naming *,.naming :before,.naming :after{box-sizing:border-box}code{font:.8em var(--font-code)}.naming-hero{padding:calc(var(--row) * 4) var(--naming-gutter) calc(var(--row) * 2)}.naming-hero h1{margin:0 0 calc(var(--row) / 2);font:600 clamp(40px, 4.6vw, 68px) / 1.02 var(--font-text);letter-spacing:-.025em}.naming-hero p{text-wrap:pretty;max-width:38em;margin:0;font-size:clamp(17px,1.4vw,20px)}.naming{gap:calc(var(--row) * 2) var(--split-gap);padding:0 var(--naming-gutter) calc(var(--row) * 4);grid-template-columns:minmax(0,28rem) minmax(0,1fr);align-items:start;display:grid}.settings{top:var(--row);margin:var(--row) 0 0;position:sticky}.settings-rows{--ledger-cols:8.5em minmax(0, 1fr);font-size:15px}.settings .lbl{color:color-mix(in srgb, var(--black) 70%, var(--paper))}.settings .ctl{gap:0;padding-top:0;padding-bottom:0;display:grid}.ctl-range,.ctl-pair{align-items:center;gap:14px;display:flex!important}.ctl-range input[type=range]{flex:1}.ctl-range b{min-width:2ch;font:12px var(--font-code);text-align:right}.ctl-pair>*{flex:1;min-width:0}.settings .hint{font:11px / 18px var(--font-code);color:color-mix(in srgb, var(--black) 62%, var(--paper));padding-bottom:5px}.settings .switch{margin:4px 0}.settings .switch button{flex:auto;min-width:0;padding:3px 8px}.settings .switch button:disabled{color:color-mix(in srgb, var(--black) 35%, var(--paper));cursor:not-allowed}.settings :is(select,input[type=text],input[type=number],textarea){box-sizing:border-box;width:100%;min-height:var(--row);font:12px / var(--row) var(--font-code);color:inherit;border:0;border-bottom:1px solid color-mix(in srgb, var(--black) 45%, var(--paper));background:0 0;border-radius:0;outline:0;margin:0;padding:0}.settings :is(select,input,textarea):focus-visible{border-bottom-color:var(--black)}.settings textarea{resize:vertical}.settings select{-webkit-appearance:none;appearance:none;cursor:pointer;background:linear-gradient(45deg,#0000 50%,currentColor 50%) right 6px center/5px 5px no-repeat,linear-gradient(-45deg,#0000 50%,currentColor 50%) right 1px center/5px 5px no-repeat;padding-right:18px}.settings ::placeholder{color:color-mix(in srgb, var(--black) 45%, var(--paper))}.folder-sheet--names{--pp:var(--blue);--pp-text:var(--on-black);background:var(--pp)}.folder-sheet--code{--pp:var(--black);--pp-text:var(--on-black);background:var(--pp)}.folder-sheet--css{--pp:var(--red);--pp-text:var(--black);background:var(--pp)}.folder-sheet--names{--tab-left:0px}.folder-sheet--code{--tab-left:130px}.folder-sheet--css{--tab-left:246px}.folder-tab{padding:0 var(--row) 0 calc(var(--row) * 1.25)}.folder-sheet--names .folder-body{padding:var(--row)}pre.code{padding:var(--row) var(--row) var(--row) calc(var(--row) * 2);font:12px / var(--row) var(--font-code);color:var(--pp-text);white-space:pre;margin:0;overflow-x:auto}#css{max-height:calc(var(--row) * 18);overflow-y:auto}.code .s{color:var(--yellow)}.code .f{color:color-mix(in srgb, var(--blue) 40%, var(--on-black))}.code .k{color:color-mix(in srgb, var(--red) 55%, var(--on-black))}.folder-sheet--css .code .s,.folder-sheet--css .code .f,.folder-sheet--css .code .k{color:color-mix(in srgb, var(--black) 72%, var(--red))}.meta{margin:0 0 calc(var(--row) / 2);font:12px / var(--row) var(--font-code);letter-spacing:.04em;color:color-mix(in srgb, var(--on-black) 70%, var(--blue))}.error{margin:0 0 var(--row);padding:calc(var(--row) / 2) 14px;font:12px / 1.5 var(--font-code);color:var(--black);background:var(--red)}.tiles{flex-wrap:wrap;align-items:stretch;display:flex}.tile{min-width:84px;font:11px / 1.4 var(--font-code);flex-direction:column;justify-content:flex-end;padding:10px;display:flex;position:relative}.tile .name{font:600 16px / 1.15 var(--font-text);word-break:break-all;margin-bottom:2px}.tile.is-base{box-shadow:inset 0 0 0 2px var(--on-black), inset 0 0 0 3px var(--blue);z-index:1}.tile.is-base:before{content:"base";font:10px / 18px var(--font-code);color:var(--blue);background:var(--on-black);padding:0 6px;position:absolute;top:0;left:0}.tile.is-new{outline-offset:-5px;outline:1px dashed}.colors .tile{height:calc(var(--row) * 4);flex:84px}.sizes{align-items:flex-end;gap:10px}.sizes .tile{color:var(--on-black);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--on-black) 60%, var(--blue));flex:none;justify-content:flex-start}.grow{align-items:center;display:flex}.grow button{z-index:2;width:22px;height:22px;font:14px / 1 var(--font-code);color:var(--black);background:var(--on-black);border:1px solid var(--black);cursor:pointer;border-radius:0;margin:0 -11px;padding:0;position:relative}.grow button:hover{color:var(--on-black);background:var(--black)}.sizes .grow button{margin:0}.growing{margin-top:calc(var(--row) * 2)}.growing h2{margin:0 0 calc(var(--row) / 2);font:600 24px / var(--row) var(--font-text);letter-spacing:-.01em}.growing p{max-width:40em;margin:0 0 var(--row)}.growing-rows{--ledger-cols:minmax(0, 1fr);font:12px var(--font-code)}.growing-rows:not(:empty){margin-bottom:var(--row);box-shadow:inset 0 1px 0 var(--lg-rule)}.rerun{min-height:var(--row);font:12px var(--font-code);color:var(--on-black);background:var(--black);cursor:pointer;border:0;border-radius:0;padding:0 14px}.rerun:hover{background:var(--blue)}@media (width<=899px){.naming{grid-template-columns:minmax(0,1fr)}.settings{position:static}}@media (width<=640px){.folder-sheet--code{--tab-left:96px}.folder-sheet--css{--tab-left:176px}.settings-rows{--ledger-cols:6.5em minmax(0, 1fr);font-size:14px}.settings-rows>:not([data-ledger-skip]){grid-template-columns:var(--row) var(--ledger-cols)}.folder-sheet--names .folder-body{padding:calc(var(--row) / 2)}.settings .switch button{padding:3px 5px;font-size:11px}}