html{font-family:sans-serif;--top-nav-height: 3rem}nav{position:fixed;top:0;left:0;right:0;height:var(--top-nav-height);background-color:#aaa;display:flex;justify-content:space-between}nav section#cwd-display{width:25%;font-size:1.5rem;text-align:left;padding-left:10px;line-height:var(--top-nav-height)}nav section#tools{width:50%;display:flex;justify-content:flex-end}nav section#tools button{background-color:transparent;border:none;cursor:pointer;padding:0 15px}nav section#tools button:nth-child(2){border-right:2px solid #444}nav section#tools button:hover{background-color:#ccc}main{position:fixed;top:var(--top-nav-height);left:0;right:0;bottom:0}main section#dir-listing>.fl-ctr{width:100%;padding:10px;display:flex;justify-content:space-between}main section#dir-listing>.fl-ctr:nth-child(odd){background-color:#eee}main section#dir-listing>.fl-ctr button{border:none;font-size:1.25rem;background-color:transparent;cursor:pointer;margin-right:20px}main section#dir-listing>.fl-ctr div.fl-edit-buttons{display:flex;align-items:center;justify-content:right}main section#dir-listing>.fl-ctr div.fl-edit-buttons button,main section#dir-listing>.fl-ctr div.fl-edit-buttons img{width:24px;height:24px}main section#dir-listing>.fl-ctr:hover{background-color:#ddd}section#texteditor{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#fff;padding:5px}section#texteditor header{font-size:1.5rem;text-align:center}section#texteditor section button{width:100%;background-color:#fff;border:1px solid black;margin:0;cursor:pointer;height:2rem;transition:background-color .2s}section#texteditor section button:first-child{border-bottom:none;border-top-left-radius:5px;border-top-right-radius:5px}section#texteditor section button:last-child{border-bottom-left-radius:5px;border-bottom-right-radius:5px}section#texteditor section button:disabled{cursor:initial}section#texteditor section button:not(:disabled):hover{background-color:#ccc}section#texteditor[hidden]{display:none}footer{position:fixed;bottom:0;left:0;right:0;height:2rem;background-color:#aaa;display:flex;justify-content:center;align-items:center}footer p{margin:20px}.code-editor{position:relative;height:80%;margin-bottom:10px}.code-editor textarea,.code-editor pre{position:absolute;top:0;left:0;right:0;bottom:0;border:none;background-color:transparent;outline:none;padding:5px;margin:0;font-size:.9rem;font-family:monospace}.code-editor textarea{resize:none;color:transparent;caret-color:#000;overflow:auto;text-wrap:nowrap;word-wrap:normal}.code-editor pre{background-color:#ddd;border-radius:5px;overflow:hidden}.code-editor pre .token{color:#000}.code-editor pre .token.keyword,.code-editor pre .token.boolean{color:#00f}.code-editor pre .token.string{color:green}.code-editor pre .token.number,.code-editor pre .token.constant,.code-editor pre .token.builtin{color:#ff32b1}.code-editor pre .token.class-name,.code-editor pre .token.decorator{color:#a0a;font-weight:700}.code-editor pre .token.function{color:#8a2be2;font-weight:700}.code-editor pre .token.comment{color:#008b8b}.code-editor pre .token.property,.code-editor pre .token.interpolation{color:#8b0000}
