html { font-size: 14px; height: 100%; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } @media (min-width: 768px) { html { font-size: 16px; } } html { position: relative; min-height: 100%; } body { margin: 0; min-height: 100%; } textarea { width: 100%; height: 100%; padding: 15px; margin: 0; resize: none; color: #444; font-size: 12px; font-family: Consolas, 'Courier New', monospace; outline: none; position: absolute; box-sizing: border-box; border-width: 0; } .dark textarea { background-color: #222; color: #ddd; } .toast { position: fixed; bottom: -30px; right: 25px; font-size: 11px; padding: 6px; color: #fff; transition: bottom 0.3s; opacity: 0.8; border-radius: 5px 5px 0 0; } .toast.show { bottom: 0; } .toast#saved-indicator { background-color: green; } .toast#update-indicator { background-color: orangered; } form input[type=password] { display: block; margin: 20px auto; font-size: 20px; padding: 8px; border: 1px solid #999; border-radius: 4px; color: #999; }