*{padding:0;margin:0;box-sizing:border-box}.navbar{display:flex;justify-content:space-between;align-items:center;background:#0e0e11;padding:.8rem 1rem;height:9vh;min-height:0}.btn-container{display:flex;align-items:center;justify-content:center;gap:1.5rem;flex-direction:row;padding-right:1rem}.btn{display:flex;align-items:center;flex-direction:row;justify-content:center;background:#444857;gap:.5rem;color:#fff;padding:.6rem 1rem;border-radius:4px;cursor:pointer;font-weight:700;font-family:Roboto,sans-serif;font-size:1rem}.btn:hover{background:#686c83f7}.grid-panel{display:grid;min-height:0;height:91vh;grid-template-rows:48vh 1fr;overflow:hidden}.top-grid{display:grid;grid-template-columns:repeat(3,1fr);height:48vh;background:#23272f}.top-flex{display:flex;height:91vh;min-height:0;overflow:hidden}.editors-column{display:flex;flex-direction:column;flex:35%;min-width:0;background:#23272f;min-height:0}.code-output-container{height:100%;min-height:0;flex:65%}.edit-container{background:#212326;border-bottom:6px solid #212326}.edit-header{background:#2f3238;padding:.5rem 1.1rem;font-weight:600;display:flex;align-items:center;justify-content:space-between;flex:0 0 auto}.edit-title{font-size:1rem;letter-spacing:1px;color:#e0e0e0;text-transform:uppercase;font-family:Roboto,sans-serif}.code-editor{border:2px solid #31343a}button{background:none;border:none}img{width:20px;height:20px;cursor:pointer}.code-output{height:100%;width:100%;flex:1;border:none;outline:none}.loading{font-size:1.1rem;color:#eaeaea;font-family:Roboto,sans-serif;letter-spacing:1.2px}@media (max-width: 768px){.navbar{flex-wrap:wrap;align-items:center;height:auto;padding:.5rem}.btn-container{gap:.8rem;padding-right:0rem}.btn{padding:.6rem .85rem}button[title="change layout"],button[title="expand editor"],.edit-header{display:none}.tab-btns{display:flex;flex-direction:row;padding:0rem .3rem 0rem .2rem;background-color:#1e2022;height:2rem}.tab-btns button{padding:.5rem 1rem;font-size:.8rem;font-weight:500;color:#e0e0e0;margin:0 1px 0 0;font-family:Roboto,sans-serif;background-color:#33353f;cursor:pointer}.tab-btns button:hover{background-color:#227c79}.tab-btns button:is(:active,:focus){background-color:#484c5b}.tabs-editor{min-width:0;height:100%;overflow:hidden}.edit-container{min-width:0;height:40vh!important;overflow:hidden}.code-output-container{height:calc(51vh - 2.05rem);min-height:0;overflow:hidden}}
