.dimension-input-wrapper{display:flex;align-items:center;gap:10px;margin-top:20px}.dimension-input{padding:10px 0 10px 10px;font-size:20px;outline:none;width:60px;height:30px;border:1px solid black;border-radius:3px}.matrix-wrapper{display:flex;flex-direction:column;align-items:center;gap:10px;margin:20px 0}.matrix-container{display:grid;border:1px solid #ffffff;width:fit-content}.matrix-box{width:50px;outline:none;padding:2px;font-size:20px;text-align:center;background-color:#1d1d1d;color:#fff;border:1px solid #ffffff;aspect-ratio:1 / 1}.result-matrix-container{display:grid;border:1px solid #ffffff;width:fit-content;margin-bottom:10px}.double-matrix-layout{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:20px}.matrix-box-1,.matrix-box-2{width:50px;outline:none;padding:2px;font-size:20px;text-align:center;background-color:#1d1d1d;color:#fff;border:1px solid #ffffff;aspect-ratio:1 / 1}.matrix12-wrapper{display:flex;gap:30px;justify-content:center;flex-wrap:wrap;margin-top:20px;padding:0 10px}.sidebar-wrapper{position:fixed;background-color:#1b1b1b;width:240px;height:100%;overflow-y:scroll;-webkit-user-select:none;user-select:none;left:-240px;transition:left .2s;z-index:1;scrollbar-width:none}.sidebar-wrapper::-webkit-scrollbar{width:0px}.sidebar-wrapper div{padding:16px;transition:background-color .2s;cursor:pointer}.sidebar-wrapper div:hover{background-color:#5d17de}@media screen and (width >= 720px){.sidebar-wrapper{left:0}}.tab-wrapper{position:relative;margin-top:62px;height:calc(100vh - 64px)}.currentTab-wrapper{height:100%;overflow-y:scroll}.currentTab-wrapper::-webkit-scrollbar{width:4px;background-color:#121212}.currentTab-wrapper::-webkit-scrollbar-thumb{background-color:#5d17de;border-radius:10px}.sidebar-background-cover{display:none;position:fixed;background-color:#6765651a;inset:0}.show-sidebar-cover{display:block}@media screen and (width >= 720px){.currentTab-wrapper{margin-left:240px}.sidebar-background-cover{display:none}}.header-wrapper{position:fixed;top:0;z-index:2;background-color:#1b1b1b;gap:10px;padding:16px;width:100%}.routes-wrapper{display:flex;margin:0 auto;gap:10px;overflow-x:scroll;max-width:80%;width:fit-content;scrollbar-width:none}.routes-wrapper::-webkit-scrollbar{display:none}.route{color:#fff;padding:6px 10px;border-radius:4px;min-width:fit-content;margin-right:4px;text-decoration:none;cursor:pointer;transition:background-color .2s}.route:hover,.active-route{background-color:#5d17de}.sidebar-toggle-btn{position:absolute;display:grid;place-items:center;background-color:transparent;left:10px;width:30px;height:30px;border-radius:50%;border:none;outline:none;cursor:pointer;transition:background-color .2s}.sidebar-toggle-btn svg{color:#fff}.remove-sidebar-toggle-btn{display:none}.show-sidebar{left:0}@media (hover: hover){.sidebar-toggle-btn:hover{background-color:#fff3}}@media screen and (width >= 720px){.sidebar-toggle-btn{display:none}}.base-n-form{display:flex;flex-direction:column;align-items:center;padding:10px;gap:10px}.base-n-input{height:40px;border:none;outline:none;border-radius:4px;padding:4px 10px;font-size:20px}.base-results-wrapper{max-width:80%}.base-results-wrapper h2{margin-bottom:10px}.base-results-wrapper span{word-wrap:break-word}.dropdown-wrapper{position:relative;overflow:hidden;width:100%;height:40px;transition:height .2s;-webkit-user-select:none;user-select:none}.expand-dropdown-wrapper{height:240px}.selected-drop{display:flex;justify-content:space-between;align-items:center;background-color:#fff;color:#000;padding:10px;border-radius:4px;cursor:pointer}.active-drop{background-color:#5d17de;color:#fff}.droplist-wrapper{position:absolute;bottom:100%;background-color:#fff;width:100%;color:#000;border-radius:4px;min-height:fit-content;height:200px;overflow-y:scroll;transition:bottom .2s}.show-dropdown{bottom:0}.droplist-wrapper::-webkit-scrollbar{width:4px}.droplist-wrapper::-webkit-scrollbar-thumb{background-color:#5d17de;border-radius:10px}.droplist-wrapper div{padding:10px;cursor:pointer;transition:background-color .2s}.dropdown-arrow{transition:.2s}.rotate-arrow{transform:rotate(-180deg)}@media (hover: hover){.droplist-wrapper div:hover{color:#fff;background-color:#5d17de}}*{margin:0;padding:0;font-family:monospace,sans-serif;box-sizing:border-box}body{background-color:#232222;color:#fff}.container{display:flex;flex-direction:column;align-items:center;padding:20px 10px}.calc-title{text-align:center}.result-matrix-box{display:flex;flex-direction:column;justify-content:center;background-color:#1d1d1d;border:1px solid #ffffff;min-width:50px;width:auto;outline:none;padding:4px;font-size:20px;text-align:center;aspect-ratio:1 / 1;overflow:hidden}.output-title{text-align:center;margin-bottom:10px}.btn-container{display:flex;gap:20px}.btn{background-color:#de9817;color:#fff;outline:none;border:none;border-radius:4px;cursor:pointer;padding:10px 14px;font-size:18px}.calc-btn{background-color:#5d17de}.reset-btn{background-color:#fa5a25}.dim-err-msg{text-align:center;margin-top:20px}.steps-wrapper{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;margin-top:20px}.step-wrapper{display:flex;flex-direction:column;align-items:center}.drop{display:flex;justify-content:center;flex-wrap:nowrap;padding:10px;gap:10px;width:100%}.base-input-dropdown{display:flex;flex-direction:column;gap:10px;width:100%;max-width:300px}