*{margin:0;padding:0;box-sizing:border-box}:root{--main-font: "SF Mono", monospace;--alt-font: "EB Garamond", serif;--primary-color: #111;--hovered-color: #c84747;--bg-color: #fafafa;--text-color: #333;--title-font: "Philosopher", sans-serif}.header{position:fixed;top:0;left:0;right:0;z-index:100;padding:1rem 2rem;background:var(--bg-color);border-bottom:none}.header-content{display:flex;align-items:center;gap:3rem;max-width:1200px;margin:0 auto}.app-logo{font-family:var(--title-font);font-size:1.5rem;color:var(--primary-color);white-space:nowrap}body{background:var(--bg-color);color:var(--text-color);font-family:var(--main-font)}.app-container{min-height:100vh;padding-top:64px;padding-bottom:50px;display:flex;flex-direction:column}.tabs{display:flex;padding:0;gap:2rem;background:transparent}.tab-content{flex:1;display:flex;flex-direction:column}.tab-pane{display:none;flex:1}.tab-pane.active{display:flex;flex-direction:column}.tab-button{padding:0;border:none;background:none;cursor:pointer;position:relative;display:flex;font-weight:500;font-size:14px;gap:.5rem;align-items:center;color:var(--primary-color)}.tab-button:after{position:absolute;content:"";width:0;left:0;bottom:-4px;background:var(--hovered-color);height:2px;transition:.3s ease-out}.tab-button:hover:after,.tab-button.active:after{width:100%}.content-wrapper{display:grid;grid-template-columns:200px minmax(0,700px) 300px;gap:2rem;padding:0 2rem;flex:1}#editor .cm-scroller{overflow-y:auto;padding:1.5rem}.controls_section_holder{position:fixed;bottom:0;left:0;right:0;padding:1rem 2rem;display:flex;justify-content:center;border:none;margin-top:auto;background:transparent}.button-group{display:flex;gap:2rem;max-width:1200px;width:100%;justify-content:center;align-items:center}.common-buttons{display:flex;gap:3rem}.tab-specific-button{margin-left:3rem;position:relative}.tab-specific-button:before{content:"";position:absolute;left:-1.5rem;top:50%;transform:translateY(-50%);width:1px;height:20px;background:#eee}.btn{border:none;background:none;cursor:pointer;display:flex;align-items:center;gap:.5rem;font-size:14px;color:#999;padding:4px;position:relative;transition:all .3s cubic-bezier(.23,1,.32,1)}.btn:focus{outline:none}.btn:before{content:"\2022";position:absolute;left:-12px;opacity:0;transition:all .3s cubic-bezier(.23,1,.32,1)}.btn.success:before{content:"\2713";opacity:1;color:var(--hovered-color)}.btn:hover{color:var(--primary-color)}.btn:hover:before{opacity:1}.btn:hover,.btn:active{transform:translate(12px)}.btn.active{color:var(--primary-color)}.btn.active:before{opacity:1}.btn.active{transform:translate(12px)}@keyframes blink{0%{opacity:1}50%{opacity:.5}to{opacity:1}}.btn.blinking{animation:blink .3s ease}@keyframes strike-through{0%{width:0}to{width:100%}}.btn.cleared{color:#c84747;position:relative;transition:all .3s cubic-bezier(.23,1,.32,1)}.btn.cleared:before{opacity:1}.btn.cleared{transform:translate(12px)}.btn.cleared:after{content:"";position:absolute;left:0;top:50%;width:0;height:1px;background:#c84747;animation:strike-through .5s cubic-bezier(.23,1,.32,1) forwards}.ipad-keyboard-panel .controls_section_holder{bottom:70px!important;transition:bottom .3s ease!important}.ipad-keyboard-panel .shared-editor-container{bottom:120px!important;transition:bottom .3s ease!important}.ipad-keyboard-panel .left-column,.ipad-keyboard-panel .right-column{top:40%!important;transition:top .3s ease!important}.ipad-keyboard-panel .grammar-switch-container,.ipad-keyboard-panel .language-switch-container,.ipad-keyboard-panel .mode-switch-container{bottom:7rem!important;transition:bottom .3s ease!important}.header-indicators{position:absolute;right:2rem;display:flex;align-items:center;gap:1rem;height:100%}.char-counter{font-size:14px;color:#666;font-family:var(--main-font);display:flex;align-items:center}.status-indicators{display:flex;align-items:center;gap:.5rem}.ipad-keyboard-panel #editor .cm-editor{font-size:16px!important}