@font-face{font-family:TuglaVAR;src:url(../tugla-var.woff2) format("woff2");font-display:block}:root{--ux:24px;--uy:24px;--rh:24px;--ink:#F2EBDD;--bg:#000;--hair:rgba(242,235,221,.18);--acc:#E85D28}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink);overflow-x:hidden}body{font-family:TuglaVAR,monospace;font-size:calc(max(12px,calc(var(--ux)*.75))*var(--axw,1));line-height:var(--rh);text-transform:uppercase;font-variation-settings:"WDTH" 140,"HGHT" 140,"STRK" 20}#app{width:calc(var(--ux)*var(--n));margin:0;position:relative;background-image:linear-gradient(to right,var(--hair) 1px,transparent 1px),linear-gradient(to bottom,var(--hair) 1px,transparent 1px);background-size:var(--cw) var(--uy);min-height:100vh;overflow:hidden}.row{display:grid;grid-template-columns:repeat(var(--n),var(--ux));grid-auto-rows:var(--uy)}.blk{grid-column:1/-1}header{min-height:calc(max(var(--uy)*3,var(--rh)*2) + var(--rh));display:flex;align-items:center;padding-left:var(--ux)}h1{margin:0;font-size:calc(var(--ux)*1.6*var(--axw,1));line-height:max(calc(var(--uy)*3),calc(var(--rh)*2));font-weight:400}.panel{padding:0 var(--ux)}.lab{min-height:var(--rh);display:flex;align-items:center;opacity:.6;white-space:normal;overflow-wrap:anywhere;line-height:var(--rh);font-size:calc(max(11px,calc(var(--ux)*.6))*var(--axw,1))}button,select,input,textarea{font:inherit;color:inherit;text-transform:inherit;background:transparent;border:0;cursor:pointer;height:var(--rh);padding:0 calc(var(--ux)*.5);margin:0;font-variation-settings:inherit;border-radius:0}button{white-space:nowrap}button:hover{background:var(--ink);color:var(--bg)}button[aria-pressed=true],button.on{background:var(--acc);color:var(--bg)}input[type=range]{width:100%;height:var(--rh);padding:0;accent-color:var(--acc)}input[type=text]{border-bottom:1px solid var(--ink);cursor:text;width:calc(var(--ux)*10)}.axes{position:relative;display:flex;align-items:center;height:var(--rh);white-space:nowrap;gap:calc(var(--ux)*.5)}.knobrow{cursor:ew-resize;touch-action:pan-y}.track{position:relative;flex:1 1 auto;height:100%;min-width:calc(var(--ux)*4);display:flex;align-items:stretch}.track:before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--hair)}.apre{flex:none;line-height:var(--rh);opacity:.85;pointer-events:none;font-size:calc(var(--ux)*.85*var(--axw,1))}.rail{position:relative;flex:1 1 auto;height:100%}.knob{position:absolute;top:0;transform:translate(-50%);font-family:TuglaVAR;font-size:calc(var(--ux)*.85*var(--axw,1));line-height:var(--rh);color:var(--acc);pointer-events:none;text-transform:none;font-variation-settings:inherit}.aval{pointer-events:none;flex:none;width:calc(var(--ux)*2.2);text-align:right}input.sr{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.axes .aval{text-align:right;font-size:calc(max(11px,calc(var(--ux)*.55))*var(--axw,1));opacity:.7}.axes span:last-child{text-align:right}.tree details{border-top:1px solid var(--hair)}.tree details:not([open])>:not(summary){display:none}.tree summary{min-height:calc(var(--rh)*1.4);display:flex;align-items:center;cursor:pointer;list-style:none}.tree summary:before{content:"+ "}.tree details[open]>summary:before{content:"- "}.tiles{display:grid;grid-template-columns:repeat(auto-fill,var(--cw));grid-auto-rows:auto;grid-auto-flow:dense;width:100%}.tile{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;cursor:pointer;padding:0;overflow:hidden;border-radius:0;width:100%;height:auto}.tile svg{display:block;flex:none}.tile small{display:block;min-height:var(--rh);font-size:calc(max(11px,calc(var(--ux)*.5))*var(--axw,1));line-height:1.2;opacity:.7;pointer-events:none;white-space:normal;overflow-wrap:anywhere}.tile.sel{background:var(--ink);color:var(--bg)}.tile.edited small:after{content:" *"}.field{width:100%;display:block}.field svg{display:block;touch-action:none}.ctl{display:flex;flex-wrap:wrap;gap:0;min-height:var(--rh)}.pre{width:100%;min-height:calc(var(--uy)*6);display:block;padding-top:calc(var(--uy)*1.6)}.pre{position:relative}.pre span{display:block;line-height:var(--uy);overflow-wrap:anywhere;text-transform:none;outline:none;cursor:text;min-height:var(--uy);white-space:pre-wrap}.pre span:focus{background:#f2ebdd0a}#advm{position:absolute;visibility:hidden;white-space:nowrap;pointer-events:none;font-size:100px;min-height:0;line-height:1}.corner{position:absolute;top:0;opacity:.6;pointer-events:none;font-size:calc(max(11px,calc(var(--ux)*.55))*var(--axw,1));line-height:1.2;min-height:0;white-space:nowrap}.corner.tl{left:0}.corner.tr{right:0}textarea{height:calc(var(--rh)*4);width:100%;border:1px solid var(--hair);padding:calc(var(--ux)*.25);cursor:text;text-transform:none;font-size:calc(max(11px,calc(var(--ux)*.5))*var(--axw,1));line-height:1.3;font-family:inherit}.iowrap{position:relative}#ioph{position:absolute;top:calc(var(--ux)*.25 + 1px);left:calc(var(--ux)*.25 + 1px);right:calc(var(--ux)*.25 + 1px);pointer-events:none;opacity:.5;white-space:pre-wrap;overflow:hidden;text-transform:none;font-size:calc(max(11px,calc(var(--ux)*.5))*var(--axw,1))}.note{opacity:.6;font-size:calc(max(11px,calc(var(--ux)*.55))*var(--axw,1));line-height:calc(var(--rh)*.95);white-space:normal;overflow-wrap:anywhere}.cols2{display:flex;flex-direction:column}@media (min-width:900px){.cols2{flex-direction:row}.cols2>.left{width:calc(var(--ux)*var(--leftn))}.cols2>.right{flex:1;min-width:0}}@media (max-width:899px){body{font-size:calc(max(12px,calc(var(--ux)*.62))*var(--axw,1))}.tile small{font-size:calc(var(--ux)*.5*var(--axw,1))}button{padding:0 calc(var(--ux)*.3)}}@media (min-width:900px){.cols2>.left{position:sticky;top:0;align-self:flex-start;max-height:100vh;overflow-y:auto}}#big{min-height:calc(var(--uy)*3)}#back{display:none;width:100%;margin-bottom:var(--uy)}@media (max-width:700px){#back{display:block}}svg text{text-transform:none}#app.nogrid{background-image:none}#h1[contenteditable]{cursor:text;outline:none}#h1[contenteditable]:focus{background:#f2ebdd0f}#hiz{width:calc(var(--ux)*2.2);height:var(--rh);border-bottom:1px solid var(--acc);padding:0 calc(var(--ux)*.2);cursor:text;text-align:right}.hizlab{pointer-events:none;align-self:center;opacity:.7;font-size:max(11px,calc(var(--ux)*.55))}.tile svg{max-width:100%;height:auto}#animbar{display:none;position:fixed;right:12px;bottom:12px;z-index:50;background:var(--bg);border:1px solid var(--hair);align-items:center;justify-content:flex-end;gap:8px;padding:0 8px;height:28px;width:230px;overflow:hidden;white-space:nowrap}#animbar #speed{width:56px;height:24px;flex:none}#animbar #ablab{flex:none;width:96px;overflow:hidden}#animbar .hizlab{flex:none;width:44px;text-align:right}#animbar #abstop{flex:none;width:52px}
